• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Pasek na całą szerokość ekranu.

Object Storage Arubacloud
0 głosów
1,772 wizyt
pytanie zadane 25 lutego 2016 w HTML i CSS przez GCon Nowicjusz (120 p.)

Jak ustawić menu poziome na całą szerokość ekranu?

Tak jak tutaj: 

6 odpowiedzi

+2 głosów
odpowiedź 25 lutego 2016 przez Eryk Andrzejewski Mędrzec (164,260 p.)
Ustaw marginesy na 0

W chyba trzecim odcinku kursu CSS Pana Mirka jest powiedziane jak zrobić takie menu na cala szerokość
+1 głos
odpowiedź 25 lutego 2016 przez saliwan22 Gaduła (3,110 p.)
Daj sobie marginesy na 0px i width tego paska na 100%. Będziesz miał pewność że na każdej rozdzielczości twój pasek będzie na całą szerokość ekranu.
0 głosów
odpowiedź 25 lutego 2016 przez RegularLemon Stary wyjadacz (12,280 p.)

Szerokość menu na szerokość ekranu, żadnych marginów ani paddingu.

.menu {
  width: 100vw;
  margin: 0;
  padding: 0;
}

 

komentarz 26 lutego 2016 przez HaKIM Szeryf (87,590 p.)

żadnych marginów ani paddingu.

A jednak jakieś są. :)

0 głosów
odpowiedź 25 lutego 2016 przez DarkEliat Bywalec (2,810 p.)

Zgadzam się z tym, że trzeba ustawić marginesy na 0 (margin-left: 0px; margin-right: 0px;) oraz szerokość diva z menu na 100% szerokości (width: 100%). Lecz to nie wszystko ten div z opcjami menu musi być poza głównym divem strony (chyba, że div strony ma  100% szerokości, wtedy div z menu może znajdować się w środku). 

np.:

<body>

<div id="logo">LOGO</div>

<div id="menu">

<div class="opcja_menu">Strona główna</div>

<div class="opcja_menu">Download</div>

<div class="opcja_menu">Autor</div>

</div>

<div id="pojemnik">

Cała zawartość strony

</div>

</body>

 

komentarz 25 lutego 2016 przez Dynamic Bywalec (2,910 p.)
Ten pasek będzie na cala szerokość, a jak wysrotkowac w nim te przyciski ?
komentarz 26 lutego 2016 przez DarkEliat Bywalec (2,810 p.)
Z tego co pamiętam klasa opcja_menu powinna posiadać stałą długość np.: width: 100px;

By wszystkie przyciski były koło siebie należy użyć: float: left; wydaje mi się także, że trzeba klasie opcja_menu dodać: margin-left: auto; margin-right: auto;

Powinno działać, ale nie działa to spróbuj nadać menu stałą szerokość. W razie problemów pisz, sam się z tym męczyłem przez długi czas. Pozdrawiam.
0 głosów
odpowiedź 26 lutego 2016 przez BanditPlayGame Użytkownik (680 p.)

W css w sekcji body (nie musi tam być ale tam najlepiej :)  ). Następnie daj na przykład w .menu daj width: 100%;

body
{
 margin: 0;
}

.menu
{
  width: 100%;
}

 

0 głosów
odpowiedź 26 lutego 2016 przez Mateusz11 Pasjonat (22,910 p.)

Moze pomoge... Podam przyklad na klasie .pasek

.pasek
{
width: 100%;
margin: 0px !important;
}

Pozdro

Podobne pytania

0 głosów
6 odpowiedzi 648 wizyt
pytanie zadane 29 lutego 2016 w HTML i CSS przez Jakub Suszyński Użytkownik (540 p.)
0 głosów
1 odpowiedź 307 wizyt
pytanie zadane 13 września 2019 w HTML i CSS przez matedoo Nowicjusz (210 p.)
0 głosów
0 odpowiedzi 379 wizyt

92,551 zapytań

141,399 odpowiedzi

319,531 komentarzy

61,938 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...