+- 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: Jak zrobić dobry układ divów w CSS ? (/thread-jak-zrobic-dobry-uklad-divow-w-css)
Jak zrobić dobry układ divów w CSS ? - przemek89k - 31-08-2011
RE: Jak zrobić dobry układ divów w CSS ? - hieroshima - 31-08-2011
jak chcesz mieć tak jak na twoim obrazku to strone musisz wyśrodkować, a nie przesuwać każdy element o px
RE: Jak zrobić dobry układ divów w CSS ? - przemek89k - 31-08-2011
Logo wyśrodkowałem - ale np. ten czarny obrazek chce mieć zaraz na krawędzi z logiem - a więc muszę go w jakiś sposób przenieść do tego miejsca i ja to robię za pomocą px - może jest inny sposób ?
RE: Jak zrobić dobry układ divów w CSS ? - hieroshima - 01-09-2011
jaki czarny obrazek? Tło pod logiem ? Dajesz <div id="header><div id="logo">tutaj logo</div></div> a w ccsie logo wyśrodkowujesz a header dajesz tlo czarne
RE: Jak zrobić dobry układ divów w CSS ? - Dombas - 01-09-2011
(31-08-2011, 23:50)przemek89k napisał(a): Logo wyśrodkowałem - ale np. ten czarny obrazek chce mieć zaraz na krawędzi z logiem - a więc muszę go w jakiś sposób przenieść do tego miejsca i ja to robię za pomocą px - może jest inny sposób ?
Co to znaczy, że czarny obrazek chcesz mieć na krawędzi z logiem?
Ustalasz sobie szerokość strony, np. 960px.
Ustalasz sobie wysokość nagłówka, np. 200px.
Wymiary menu np. 500x50.
I piszesz:
style.css:
Kod:
div#strona {
width: 960px;
margin: 0 auto; /* centruje całość */
}
div#naglowek {
height: 200px;
background-color: #ccc; /* zrób sobie na próbę jakieś kolory teł to łatwiej będziesz nawigował elementami */
}
div#menu {
width: 500px;
height: 50px;
background-color: red;
}HTML w ramach body:
Kod:
<div id="strona">
<div id="naglowek">
<div id="menu">
Menu
</div>
Tutaj zawartość reszty nagłówka
</div>
reszta strony
</div>Jak chcesz wstawić coś przed menu po lewej stronie, np logo to nadajesz obrazkowi styl "float: left;". Do menu też musisz dodać "float: left;" wtedy jedno będzie obok drugiego. Pokombinuj z "float" i "clear" w sieci jest sporo informacji o tym. W razie czego podeślij dokładny rysunek z wymiarowanymi elementami to Ci je umieszczę w cssie.