Css layout

1923

~ Anonymní uživatel
~ 2 příspěvky

1. 6. 2007 #1

Zdravim chcel by som vas poprosit o radu...
mam problem s css layoutom a to konkretne takyto:
mam jeden hlavny div, ktory je rozdeleny tiez pomocou dalsich dvoch divov na lavu a pravu stranu,
lava strana by mala prisposobovat dlzku podla textu v nej resp sa natahovat, ale nerobi to, skusal som to pomocou min-height hacku ale akosi mi to stale nejde, text stale preteka...
Dik za radu :)

Nahlásit jako SPAM

IP: ...–

Martin Šimko

~ Redaktor

Grafoman

2. 6. 2007 #2

To 1923: takto se těžko radí, dej sem spíše celý kód. jinak jestli chceš mít fixní délku toho divu a nastavit tam lištu na scrollování použij CSS vlastnost overflow http://www.jakpsatweb.cz/css/overflow.html

Nahlásit jako SPAM

IP: ...–

Programujte.com redaktor
Sleduj mě na @MartinSimko

1923

~ Anonymní uživatel
~ 2 příspěvky

4. 6. 2007 #3

no overflow tam nechcem mat pouzite chcem aby sa ten div natahoval a nie aby sa tam zobrazila skrollovacia lista
kod je nasledovny:
css:
div.hlavne{
position: relative;
width: 700px;
min-height: 800px;
_height: 800px;
background-color: #fff;
}
#lave{
position: absolute;
left: 0px;
top: 0px;
width: 350px;
min-height: 800px;
_height: 800px;
}
#prave{
position: absolute;
right: 0px;
top: 0px;
width: 350px;
height: 800px;
}
html:
<div class="hlavne">
<div id="lave"></div>
<div id="prave"></div>
</div>

V tom lavom dive je text, a potrebujem aby sa jeho dlzke tomu textu prisposobovala, ale stale to iba preteka..

Nahlásit jako SPAM

IP: ...–

Matej Zabsky 0

Boss

5. 6. 2007 #4

Pokud v tom divu mas veci s floaty, tak tam budes muset vrazit nakonec clearfix (prazdny div s clear:both). Jinak...mas to dementne absolutne pozicovane, to muze byt take problem.

Nahlásit jako SPAM

IP: ...–

Prosím, jestli potřebujete s něčím poradit,zeptejte se na fóru. Jakýkoliv bezdůvodný pokus mě kontaktovat skončí okamžitým přidáním do ignore listu![br][br] Současný počet osob, které to nepochopily: 7

Petr Fojtík0

Věrný člen

14. 6. 2007 #5

1.barva pozadí (=bílá v hlavním sloupci) se nedědí (takže je třeba nastavit pozadí oběma sloupcům)
2. min-height:800 v hlavním bloku nefunguje (je to totéž jako height:800) a to proto, že nemá žádný obsah
(levy a pravy blok neleží v něm, ale nad ním)
SUMA SUMARUM:
Tak jak to chceš to nefunguje = levý ani pravý sloupec nemají žadný vplyv na hlavní blok a tedy ani navzájem
(pouze mohou kontrolovat zobrazení scrollbaru když přesáhnou okno).

Tohle je maximum co můžeš získat ze 2 absolutně pozic.sloupců [testováno v IE7 a FF2]:

<html>

<head>

<style>

* { margin: 0; padding: 0 }

html,body {  height: 100%; text-align:center; 

                   font-size:200%  /* můžeš měnit výšku obsahů sloupců */

}

div.hlavne{

     position: relative;

     width: 700px;

     height:  100%;  /* případně dej tady (jinde netřeba)         */

                       /* hodnotu 800px nebo jakou chceš !!!!!    */

     margin: 0 auto;

     background-color: #fff;

}

#lave{

     position: absolute;

     left: 0px;

     top: 0px;

     width: 350px;

     min-height: 100%;

     _height: 100%;

     background-color: red;

}

#prave{

     position: absolute;

     right: 0px;

     top: 0px;

     width: 350px;

     min-height: 100%;

     _height: 100%;

     background-color: yellow;

}

</style>

 <title> Web s 2 sloupci absolutně pozicovanými </title>

</head>

<body>

<div class="hlavne">

     <div id="lave">

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          xxxxxxxx<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

     </div>

     <div id="prave">

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          aaaaaaaa<br>

          xxxxxxxx<br>

     </div>

</div>

</body>

</html>

Jestli chceš tak ti pošlu stránku s 1 pozicovaným sloupcem, ta by ti měla fungovat tak,
že když budeš přidávat obsah do levého sloupce tak se budou natahovat oba.
Jinak: nejlepší, snadné a univerzální je mít oba sloupce plovoucí

Nahlásit jako SPAM

IP: ...–

Lukaydo

~ Anonymní uživatel
~ 8 příspěvků

14. 6. 2007 #6

To Petroff:diki moc, uz to mam vyriesene zbavil so msa toho absolutneho pozicovania dal som to pomocou float + par nejakych dalsich drobnosti a uz to fachci

Nahlásit jako SPAM

IP: ...–

← Zpět na seznam vláken ← Zpět do Fóra