+- 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ł: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: CSS problem z rozjeżdzającym się menu (/thread-css-problem-z-rozjezdzajacym-sie-menu)
CSS problem z rozjeżdzającym się menu - azupak - 29-04-2012
Witam,
co jest źle w kodzie, że element po prawej stronie jest poziom niżej niż dwa pozostałe?
Kod:
#menu{
height: 74px;
padding:30px 0px 0px 0px ;
}
#menu-l {
background: url("images/header_l.png") no-repeat scroll right top transparent;
float: left;
height: 74px;
width: 13px;
}
#menu-m {
background: url("images/header_m.png") repeat-x scroll 0 0 transparent;
height: 74px;
width:98%;
margin: 0 16px 0 0px;
}
#menu-r {
background: url("images/header_r.png") no-repeat scroll left top transparent;
float: right;
height: 74px;
width: 13px;
}Kod:
<div id="menu">
<div id="menu-l"></div>
<div id="menu-m"></div>
<div id="menu-r"></div>
</div>Prosiłbym o podpowiedź, bo szukam i szukam, a nic z tego dalej nie wychodzi.
RE: CSS problem z rozjeżdzającym się menu - Moody - 29-04-2012
A możesz pokazać jak to wygląda na stronie? Może zmień pozycje right na left dla menu-r
RE: CSS problem z rozjeżdzającym się menu - azupak - 30-04-2012
(29-04-2012, 21:39)Moody napisał(a): A możesz pokazać jak to wygląda na stronie? Może zmień pozycje right na left dla menu-r
Wygląda tak jak jest w załączniku:
screen.jpg (Rozmiar: 35.76 KB / Pobrań: 11)
RE: CSS problem z rozjeżdzającym się menu - azupak - 01-05-2012
czy ktoś wie jak rozwiązać ten problem?
RE: CSS problem z rozjeżdzającym się menu - Heyek - 01-05-2012
Cześć,
Myślałem przez chwilę nad twoim problemem i wymyśliłem dużo prostsze rozwiązanie od twojego. Zamiast korzystania z 3 elementów możesz zrobić to w jednym.
Kod css:
Kod:
#menu{
<!-- ustawiasz tło całego menu i powielanie poziome -->
background-image: url("images/header_m.png");
background-repeat: repeat-x;
<!-- zaokrąglenie rogów menu, możesz wpisać dowolną wartość np. 5px -->
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
<!-- styl, wielkość i kolor ramki -->
border-style: solid;
border-width: 1px;
border-color: kolor;
<!-- wysokość i szerokość twojego menu -->
height: 74px;
width: 800px;
}Kod HTML
Kod:
<div id="menu">
Zawartość menu
</div>