+- 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: Problem z zaokrąglonymi rogami (/thread-problem-z-zaokraglonymi-rogami)
Problem z zaokrąglonymi rogami - zoom24 - 23-02-2010
Witam.
Otóż mam problem z css i poprawnym wyświtleniem pudełek, które są umieszczone w większym
pudełku z zaokrąglonymi rogami.
Kod html
Kod:
<div id="container">
<div id="header"></div> <!-- Tu podstawiany jest obrazek zaokranglający nagłówkek //-->
<div id="content"> <!-- W content wyświtlane jest tło w moim przypadku obrazkowe //-->
<div style="width:200px; height:100px; border:1px solid blue;"></div> <!-- W tym przypadku działa gdyż nie ma float:left //-->
<div style="width:200px; height:100px; float:left; border:1px solid blue;"></div> <!-- ustawia się pod powyższym pudełkiem //-->
<div style="width:200px; height:100px; float:left; border:1px solid blue;"></div> <!-- ustawia się po prawej stronie od pudełka środkowego //-->
</div>
</div>
<div id="footer"></div> <!-- Tu podstawiany jest obrazek dolny - zaokranglający //-->Kod:
#container {
width: 758px;
margin: 0 auto;
}
#header {
height: 20px;
position: relative;
background: url('images/header.gif') left bottom no-repeat;
}
#content {
background: #ffffff url('images/content.gif') 0 0 repeat-y;
height: auto;
}
#footer {
width: 758px;
margin: 0 auto;
height: 20px;
background: url('images/footer.gif') no-repeat;
}Mój problem polega na tym,że 3 pudełka które są w sekcji content w kodzie html
powinny być wszystkie obok siebie, a jest tak że pierwsze jest ok, tzn mieści się w container
a dwa poniższe znajdują się pod pierwszym i wyjeżdżają poza ramy mojego całego contenera.
A ma być tak że mają być 3 obok siebie, i dodatkowo żeby nie wyjeżdżały poza container
Z góry dziękuję za pomoc lub swkazówki ;D
RE: Problem z zaokrąglonymi rogami - mike - 23-02-2010
Dodaj float: left do pierwszego div'a.
Na przyszłość staraj się dać linka wtedy przynajmniej można zobaczyć w czym problem.
RE: Problem z zaokrąglonymi rogami - zoom24 - 23-02-2010
tutaj jest link do tego o co mi chodzi http://zoom24.cba.pl/
a gdy dodam float:left do pierwszego to się pole content nie powiększa automatycznie
jak to wygląda zobaczyć można na powyższym linku.
RE: Problem z zaokrąglonymi rogami - mike - 23-02-2010
dla #content i pierwszego div'a w content float: left;
#footer: clear: both
powinno być ok
RE: Problem z zaokrąglonymi rogami - zoom24 - 23-02-2010
Zadziałało
Poprawke już nie wrzucałem na serwer. Dzięki wielkie mike.