+- 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: div w divie (/thread-div-w-divie--5079)
div w divie - _mlody_ - 21-10-2010
Witam,
dopiero zaczelem nauke z css wiec prosze o troche wyrozumialosci. Mam taki problem.. chce zrobic duzego diva ktory bedzie trzymal cala strone ("caly").. w srodku tego diva chce dodac 3 inne divy.. jeden u gory ("naglowek") a 2 w jednej lini pod pierwszym. ("lewaKolumna", "tresc")
udaje mi sie zrobic pierwszego diva u gory i 2 divy w jednym rzedzie pod nim lecz div ktory ma trzymac wszystkie te divy trzyma tylko pierwszego.
oto fragment html:
Kod:
<body>
<div id="caly">
<div id="naglowek">
<h1>Nazwa tej strony</h1>
</div>
<div id="big">
<div id="lewaKolumna">
<h1><center>Menu</center></h1>
<ul>
<li><h2><a href="jeden.html">jeden</a></li></h2>
<li><h2><a href="dwa.html">dwa</a></li></h2>
<li><h2><a href="trzy.html">trzy</a></span></a></li></h2>
</div>
<div id="tresc">
<h3>tresc</h3>
</div>
</div>
</div>
</body>a oto fragment css:
Kod:
div {
width: 800px;
margin: auto;
}
h1 { font: normal 16px verdana, arial, sans-serif;
padding: 1px;
color: black;
margin: 0;
line-height: 25px;
}
h2 { font: normal 14px verdana, arial, sans-serif;
padding: 1px;
color: black;
margin: 0;
line-height: 25px;
}
h3 {
}
#naglowek {
padding: 0px;
border: 1px hidden #CCF;
width: 970px;
height: 70px;
background-image:
url('header-bg.jpg');
}
#lewaKolumna {
border: 1px solid #CCF;
margin-top: 0px;
margin-bottom: 10px;
margin-right: 5px;
width: 240px;
float: left;
background-image:
url('leftColumn.jpg');
}
#tresc {
border: 1px solid #CCF;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 5px;
width: 710px;
float: left;
}
#caly {
border: 2px solid #000;
width: 970px;
height: auto;
}
#big {
border: 1px; solid #000;
width: 970px;
height: auto;Div "big" jest po to by divy "lewaKolumna" i "tresc" mogly byc w jednej lini.
Co jest nie tak w ktorym z kodow? Bardzo prosze o pomoc!
RE: div w divie - ixtab - 21-10-2010
Ten arkusz styli jest napisany źle od samego początku... Powinieneś trochę się podszkolić w CSS.
Póki co dodaj do #big
Kod:
overflow:hidden;RE: div w divie - _mlody_ - 21-10-2010
Szkole sie w CSS od jakiegos tygodnia wiec jeszcze malo bardzo potrafie.. Wspominalem o tym na poczatku postu.. Dzieki za pomoc. A apropo arkusza styli to nie jest on tutaj caly, wstawilem tylko wyrywek.. tak jak i html zreszta. A co jest w nim nie tak? Bede wdzieczny za pomoc.
RE: div w divie - Pedro84 - 21-10-2010
<center>, zamykasz jakis dziwny span w menu...
RE: div w divie - ixtab - 21-10-2010
http://jigsaw.w3.org/css-validator/
Wpisz sobie adres Twojej strony, to wyrzuci Ci błędy
RE: div w divie - _mlody_ - 21-10-2010
@Pedro84
Zmienilem <center> w html na taki kod w css:
Kod:
text-align: center;dzieki.
Sprawdzic strony nie moge bo jeszcze nie mam jej na servie.
I jeszcze takie pytanko jak zrobic zeby w menu tam gdzie sa linki jeden pod drugim ("jeden", "dwa", "trzy") zamiast kropek jako wypunktowania wstawic jakies male grafiki. Dajmy na to ze jeden z linkow bedzie sie nazywal "sport" i zamiast kropki przed nim chcial bym dac malego cliparta - piłkę ?
RE: div w divie - swinia - 21-10-2010
to wybierz opcję poprzez wprowadzenie kodu, wklej kod i sprawdź
RE: div w divie - _mlody_ - 21-10-2010
Sprawdzilem wywalilo mi 2 male bledy ktore juz poprawilem. Dzieki.
Czy moze mi ktos pomoc z tym?
"I jeszcze takie pytanko jak zrobic zeby w menu tam gdzie sa linki jeden pod drugim ("jeden", "dwa", "trzy") zamiast kropek jako wypunktowania wstawic jakies male grafiki. Dajmy na to ze jeden z linkow bedzie sie nazywal "sport" i zamiast kropki przed nim chcial bym dac malego cliparta - piłkę ? "
RE: div w divie - Pedro84 - 21-10-2010
Google.pl -> unordered list image
RE: div w divie - ixtab - 21-10-2010
Hmmm, najłatwiejsza metoda jaką mogę Ci doradzić to przebadanie lewego menu na wp.pl. Jest tam dokładnie to o co Ci chodzi.
Jeśli nie znasz jeszcze rozszerzenia dla przeglądarek o nazwie FIREBUG - polecam. Ściągnij (jest dostępne dla FF, Chrome, Safari... a dla IE jako aplet). Wbij na wp.pl, kliknij prawym przyciskiem myszy na którąkolwiek pozycję menu i wybierz "Zbadaj element". Zobaczysz jak na dłoni jak to jest zrobione z żywym przykładem