+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: [CSS],[HTML] Stała szerokość menu niezależnie od ilości zakładek (/thread-css-html-stala-szeroko%C5%9Bc-menu-niezaleznie-od-ilo%C5%9Bci-zakladek)
[CSS],[HTML] Stała szerokość menu niezależnie od ilości zakładek - Wojtek_Jaskula - 13-12-2011
Witam wszystkich,projektuję właśnie jedną stronę i mam mały problem z paskiem menu, który chciałbym żeby miał ustaloną z góry szerokość (630 px) tzn niezależnie czy w pasku będą 3 zakładki czy 7 pasek musi być stałej szerokości (wiem, że będzie to wyglądać za przeproszeniem jak gówno ale ja to tylko oklepuje
, ważne, żeby odstępy między poszczególnymi zakładkami były równe i to wszystko. mam nadzieje że da się to jakoś po ludzku i szybko zrobić ponieważ goni mnie termin 
Tak wygląda moje menu:
}
ul, ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
font-size: small;
white-space: nowrap;
}
ul {
float: right;
background-color: #fff;
padding: 1px 0 1px 1px;
font-size: x-small;
white-space: nowrap;
}
ul li {
float: right;
font-style: Impact;
font-size: x-small;
white-space: nowrap;
}
ul a:link, ul a:visited {
text-decoration: none;
display: block;
font-weight: bold;
background: url("MENUBAR/1.jpg") repeat-x center;
0%; color: #fff;
padding: 10px 20px;
font-size: x-small;
white-space: nowrap;
}
ul a:hover {
background-image: url("MENUBAR/2.jpg");
font-style: Impact;
font-size: x-small;
white-space: nowrap;
}
Jpegi są raczej nie ważne
Zabiegi typu width 630 nie pomagają ponieważ każda zakładka rozszerza się po kolei.
Z góry dziękuje za pomoc
RE: [CSS],[HTML] Stała szerokość menu niezależnie od ilości zakładek - Kartofelek - 13-12-2011
no więc tak:
LI - nie ma dla LI takiego stylu jak list-style-type. Jak nazwa wskazuje to styl listy.
UL - dajesz mu width, eight, overflow:hidden, text-align:center; display:block nie musisz bo to element blokowy
LI - dajesz im display:inline-block; + max-width, height itp
A - dajesz im display:block; width:100%; height:100%; text-align:center + reszta stylowania
font-style: Impact; - co to jest za styl? czy to nie jest font-family?
0%; color: #fff; - co to jest?
RE: [CSS],[HTML] Stała szerokość menu niezależnie od ilości zakładek - Wojtek_Jaskula - 13-12-2011
list style - rozumiem usunąć
display block - usunięte
no i zmieniam na font family
0%; color: #fff; - co to jest? <--- źle skopiowałem , już tego nie ma.
próbuję , 3 minuty zaraz zobaczę
@Kartofelek - albo źle zrozumiałem Twoje rady albo mi coś nie wyszło, generalnie nic się nie zmieniło (raczej źle zrozumiałem
)Wyedytowałem tak (pewnie zrobione źle , niewiem dlaczego ale ciężko mi ogarnąć to menu)
ul, ul li {
margin: 0;
padding: 0;
font-size: small;
white-space: nowrap;
width,eight,overflow:hidden;
text-align:center;
}
ul {
float: right;
background-color: #fff;
padding: 1px 0 1px 1px;
font-size: x-small;
white-space: nowrap;
}
ul li {
float: right;
font-size: x-small;
white-space: nowrap;
display:inline-block;
max-width:630px;
}
ul a:link, ul a:visited {
text-decoration: none;
display: block;
font-weight: bold;
background: url("MENUBAR/1.jpg") repeat-x center;
0%; color: #fff;
padding: 10px 20px;
font-size: x-small;
white-space: nowrap;
width: 100%
height: 100%
text-align: center;
}
ul a:hover {
background-image: url("MENUBAR/2.jpg");
font-size: x-small;
white-space: nowrap;
width: 100%
height: 100%
text-align: center;
}
RE: [CSS],[HTML] Stała szerokość menu niezależnie od ilości zakładek - Kartofelek - 13-12-2011
Ajjjjjjjjjjjjjj boli.
co to jest width,eight,overflow:hidden;?????
Jak ja piszę daj dla ul width, height, overflow etc, to ja tylko wymieniam co powinieneś użyć. Więc:
Kod:
ul {
width:680px;
height:30px;
overflow:hidden;
list-style-type:none;
padding:0;
margin:0;
text-align:center;
}
ul > li {
display:inline-block;
max-width:200px;
height:30px;
backgorund:url(.....) center top no-repeat;
}
ul > li a {
display:block;
width:100%;
height:100%;
text-align:center;
font:13px Impact, Tahoma, sans-serif;
color:#333;
background:url(......) center top no-repeat;
}
ul > li a:hover {
background:url(......) center top no-repeat;
}ITP
RE: [CSS],[HTML] Stała szerokość menu niezależnie od ilości zakładek - Wojtek_Jaskula - 13-12-2011
Ahaaaaa
EJ bo myślałem że moge przecinkami oddzielić znaczniki,
przepraszam za zadnie bólu , ale nie skumałem
@Kartofelek probowalem to co Ty dałeś i jak by to powiedzieć , nie działa
czy na pewno da się zrobić stałą szerokość menu tak że np
w 1 podstronie mamy 7 zakładek
w 2 podstronie mamy 3 zakładki
szerokość menu zawsze bedzie 630 px ?
RE: [CSS],[HTML] Stała szerokość menu niezależnie od ilości zakładek - Wojtek_Jaskula - 15-12-2011
Problem rozwiązany, zrobiłem to troche inaczej a mianowicie w javie