Problema aliniere div-uri

Coduri intrebari, probleme legate de HTML, XHTML si CSS
tycyssg
Mesaje:58

Problema aliniere div-uri

Buna ziua din nou
Am incercat sa renunt la tabele si m-am apucat de div-uri..m-am documentat cat de cat dar mi-am dat seama ca mai am multe de invatat.Am si eu o problema legat de div-uri.

Imagine

Exact cum se vede si in poza Incerc sa pun acel div indicat de sageata care este empty doar cu o proprietate de border la sfarsitul continutului paginii, exact unde este linia rosie..Si nu reusesc de nici o culoare...am pus fel de fel de proprietati din ce am citit pe net in css dar degeaba.
Si a doua problema pagina nu-si face scroll si nu stiu de ce..la un continut mai lung el dispare sau cand schimb rezolutia sau micsorez fereastra de browser continutul paginii dispare..

Ma poate lamuri cineva cu ce se mananca div-urile astea si alinierea lor inline si alte divuri sub ele..ca eu nu prea am reusit sa-mi dau seama.

PS:Incerc sa pun continul paginii dar imi da eroare 403..nu stiu de ce

Am urcat site-ul pe un host..
astrotm.com/demo/

PS2:Asta nu e asa importanta..dar daca apesi pe un buton din meniu continul butonului mi-l da la centru nu sus..se poate face cumva sa imi arate contextu sus unde se duce textul.
MarPlo Mesaje:4343
Salut
Personal nu am inteles ce vrei sa obtii si ce nu merge.
Div-urile se pot alinia cu proprietatea css "inline-block" sau "float" (la "float" se adauga un alt element html dupa acele div-cri, la care i-se aplica "clear: both" in css).
Incearca sa pui partea de cod css si cea din <body>, fara sectiunea <head>.

- Exemplu cu "inline-block':

Cod: Selectaţi tot

<style type="text/css">
#dv1, #dv2 {
 display: inline-block;
 border: 2px solid blue;
}
#dv1 {
 width: 22.5%;
 height: 25em;
 margin: 1em 1% 5px 0.5em;
}
#dv2 {
 width: 70%;
 height: 40em;
 margin: 1em 0.5em 5px 2%;
}
</style>

<div id="dv1">
 <ul>
  <li>Meniu</li>
 </ul>
</div>
<div id="dv2">
 <div>Continut ...</div>
</div>
- Exemplu cu "float":

Cod: Selectaţi tot

<style type="text/css">
#dv1, #dv2 {
 position: relative;
 float: left;
 border: 2px solid blue;
}
#dv1 {
 width: 22.5%;
 height: 25em;
 margin: 1em 1% 5px 0.5em;
}
#dv2 {
 width: 70%;
 height: 40em;
 margin: 1em 0.5em 5px 2%;
}
.clr { clear: both; }
</style>

<div id="dv1">
 <ul>
  <li>Meniu</li>
 </ul>
</div>
<div id="dv2">
 <div>Continut ...</div>
</div>
<br class="clr" />
- Poti cauta si pe internet despre "inline-block, float, align divs".
tycyssg Mesaje:58
Am reusit sa le aliniez inline..e ok dar exista vreo posibilitate ca atunci cand e o rezolutie mai mica spre exemplu 800x600 divu-urile sa ramana unde sunt , nu sa vina unele sub altele? ma refer la alta in afara de cea cu table.
MarPlo Mesaje:4343
Incearca sa folosese pentru marme si margini dmensuni in procente (%). Poti testa exemplele date mai sus.

Subiecte similare