Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
[CSS] rozciągnięcie diva
#1
Witam. Nie wiem dlaczego div container nie chce ustawić wysokość na minimalną 100% tak aby div footer był zawsze na dole strony.Proszę o wskazówki. Posiadam taką konstrukcje
html:
Kod:
<body>
  <div id="preload"></div>
  <div id="container">
     <div id="header">
       <div id="banner"></div>
      <div class="menu"></div>
    </div>
    <div id="body">
      <div id="blok_lewy"></div>
      <div id="blok_prawy"></div>
    </div>
    <div id="footer"></div>
  </div>
  </body>
css:
Kod:
#preload{
    position:absolute;
    left:-9999px;
    top:-9999px;
}

body {
   background-color:#FF3;
   margin:0;
   padding:0;
   background-position:center top;
   font-family: Verdana, Arial, Tahoma, Helvetica, sans-serif;
   height:100%;
}
#container {
   background-color:#0F0;
   width:1024px;
   min-height:100%;
   position:relative;
   margin:auto;
}
#header {
   width:1024px;
   height:243px;
   padding-top:0px;
}
#body {
   padding:10px;
   padding-bottom:60px;   /* Wysokość stopki */
   width: 1024px;
   height:100%;
   overflow:hidden;
}
#blok_lewy{    
    width:505px;
    display:inline;
    float:left;
    height:100%;
}
#blok_prawy{
    width:505px;
    display:inline;
    float:right;
    height:100%;
    }
#body p{
    color:#d3d2d0;
    font-family:Georgia,Verdana,Tahoma,Arial;
    font-size:14px;
    margin-left:10px;
    margin-right:10px;
    text-align:left;
}
#footer {
   position:absolute;
   bottom:0;
   width:100%;
   height:60px;   /* Wysokość stopki */
   background:#6cf;
}
#banner{
    background:url(../images/banner.png) no-repeat;
    float:left;
    width:620px;
    height:192px;
    margin-left:60px;
    margin-top:35px;
}
Odpowiedz
#2
A szukałeś na forum? Niedawno był poruszany temat tego typu:

http://www.webmastertalk.pl/pionowa-linia-t-7429.html
Odpowiedz
#3
Spróbuj dodać jeszcze jednego diva w "body":
Kod:
<div id="body">
      <div id="blok_lewy"></div>
      <div id="blok_prawy"></div>
      <div id="clear"></div>
    </div>

a w css:
Kod:
#clear {
clear:both;
}
Odpowiedz
#4
Sprawa rozwiązana.
100% było ustawione dla body ale nie dla dokumentu html.
wszyscy "rodzice" muszą być ustawieni na 100% żeby można było ustawić tak "potomka "
czyli wystarczyło dodać

html,body{ ....}

Dziękuję wszystkim za zainteresowanie.
zamykam temat.
Odpowiedz


Podobne wątki…
Wątek: Autor Odpowiedzi: Wyświetleń: Ostatni post
  [css] div obok diva; hover nana 2 2,858 11-12-2012, 23:56
Ostatni post: nana
  [css] Div obok diva Mtk 7 6,064 07-10-2012, 01:54
Ostatni post: Mtk
  [CSS] Problem z pozycjonowaniem diva. Extragracz 5 3,317 31-08-2012, 16:06
Ostatni post: Extragracz
  Rozciągnięcie wierszy w tabeli dielectric 3 2,066 14-07-2012, 22:38
Ostatni post: kornell
  onclick.. divy zasłania diva itp. harvester2001 10 5,465 13-07-2012, 21:47
Ostatni post: Kartofelek

Skocz do:


Użytkownicy przeglądający ten wątek:
Sponsorzy i przyjaciele
SeoHost.pl