Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [css] Problem z ustwaieniem div'ów
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
piotrooo89
Cześć!

Zaczynam sie uczyć stylów CSS z różnym skutkiem... Ucze sie za pomocą prób i błędów. Podczaś "nauki" natrafiłem na problem:

Chce aby na stronie było następujące ułożenie

b a n e r
menu main
s t o p k a

To co aktualnie zrobiłem to

  1. <div id="banner">
  2. <p class="autorzy">PIORT</p> DLA <p class="autorzy">ANDRZEJA</p>
  3. </div>
  4.  
  5. <div id="menu">
  6. Tu ma być menu
  7. </div>
  8.  
  9. <div id="main">
  10. Tu ma być wystko wyświetlane
  11. </div>
  12. <div id="stopka">
  13. (c) piotrooo89 2008
  14. </div>


a to jest pliczek CSS:

Kod
body
{
    background-color: #FFFACD;
}

p.autorzy
{
    color: blue;
}

#banner
{
    background-color: #F0E68C;
    
    border-width: 1px;
    border-style: solid;
    
    text-align: center;
    letter-spacing: 3px;
    
    font-weight: bold;
    
    padding-top: 10px;
    padding-bottom: 5px;
    
    margin-top: 20px;
    margin-right: 20px;
    margin-left: 20px;
}

#menu
{
    background-color: #F0E68C;
    
    border-width: 1px;
    border-style: solid;
    
    float: left;
    
    width: 200px;
    
    margin-right: 20px;
    margin-left: 20px;
}

#main
{
    background-color: white;
    
    border-width: 1px;
    border-style: solid;
    
    clear: right;
    
    margin-right: 20px;
    margin-left: 20px;
}

#stopka
{
    background-color: #FFCC99;
    
    border-left: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    
    clear: both;
    
    text-align: center;
    font-size: 12px;
    
    margin-right: 20px;
    margin-left: 20px;
}


i teraz moje pytanie jak ustawić maina stopkę i menu żeby podczas rozciągania sie maina rozciągało sie również menu a pod tym wszytkim była stopka.
.radex
Właśnie chodzi o to, że (o ile dobrze zrozumiałem problem) za pomocą czystego css'a i bez hacków dla IE ciężko to zrobić.

Ale...

http://2columns.net/
cbagov
Jak najbardziej da sie bez zadnych hackow.
Dodajesz po prostu do calego swojego HTML DIV otaczajacy z okreslona szerokoscia a reszte jesli ma sie ona rozciagac - ustawiasz na 100% i gotowe.
Musisz byc jednak dokladny i w przypadku niezgodnosci sprawdzic czy nie ustawiles 100% w divie , ktory siedzi w drugim, takze ustawionym na 100% - to wtedy przewaznie powstaja niezgodnosci.
W takim przypadku musisz ustalic na sztywno szerokosc DIV otaczajacego, albo odrobine poeksperymentowac, ale jest to calkowicie wykonalne.

<div>

reszta

</div>
.radex
Ale mówicie o rozciąganiu w pionie czy w poziomie, bo już nie rozumiem biggrin.gif ?
piotrooo89
chodzi mi aby menu dostosowało sie na wysokość do maina...
tommy4
Ja to zawsze robię tak, że pod divem maina i menu mam diva, który ma tło połączonych tych dwóch divów. Po zakończeniu tych dwóch divów <br style="clear: both;" /> i śluz
.radex
No czyli dobrze mówiłem smile.gif

Taka sama wysokość kolumn:

http://2columns.net/

ew. można to zrobić tak jak tommy4 proponuje, ale czysty css lepszy tongue.gif
piotrooo89
super! dziekówka radex_p haha.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.