Panel użytkownika
Nazwa użytkownika:
Hasło:
Nie masz jeszcze konta?

[CSS] Rozciąganie i przesuwanie elementów strony pod wpływem zawartości

Ostatnio zmodyfikowano 2014-04-26 20:54
Autor Wiadomość
czosnek17
Temat założony przez niniejszego użytkownika
[CSS] Rozciąganie i przesuwanie elementów strony pod wpływem zawartości
» 2014-04-24 22:48:56
Mam layout strony zbudowany na div. W uproszczeniu wygląda tak:
index.html

<html><head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
<link rel="stylesheet" href="style.css" type="text/css" /></head>
<body>

      <div id="cont">
     
           <div id = "header">
           nagłówek
           </div>
          
           <div id = "menu">
           menu
           </div>
          
           <div id = "pg">
                Lorem ipsum
           </div>
          
          
          
                 <div class="cl"></div>
          
           <div id = "ft">
           footer
           </div>
     
     
      </div>
</body>
</html>

style.css

@charset "UTF-8";

#cont
{
 width: 1000px;
 margin: 0 auto 0;
}

#header
{
 height: 150px;
 background: red;
}

#menu
{
 width: 200px;
 height: 200px;
 float: left;
 background: yellow;
}

#pg
{
 width: 800px;
 height: 200px;
 background: green;
 float: left;
}

#ft
{

 background: navy;
 height: 20px;
}

.cl
{
 clear: both;
}
Teraz to wygląda tak:
 
Chciałbym, aby strona rozciągała się pionowo pod wpływem lorem ipsum, tzn divy pg i menu mają początkowo stałą wartość y. Gdy tekst lorem ipsum się nie mieści, kontenery pg i menu mają się wydłużyć i "popchnąć" footer w dół. W jaki sposób to zrobić?
P-108628
MrPoxipol
» 2014-04-25 17:25:47
Zamien height na min-height.
P-108664
czosnek17
Temat założony przez niniejszego użytkownika
» 2014-04-25 22:48:30
Działa, ale jak zrobić, żeby div menu też się rozciągał?
P-108690
MrPoxipol
» 2014-04-25 22:54:15
Identycznie? :)
P-108691
czosnek17
Temat założony przez niniejszego użytkownika
» 2014-04-25 23:01:37
Ale mi chodzi o to, że jak lorem ipsum się rozciągnie na np 400px, to żeby menu też się rozciągnęło.
P-108694
MrPoxipol
» 2014-04-25 23:09:55
Nie ustawiaj więc wysokości. Menu i główny div ustaw w tym samym bloku (float:left).
P-108695
czosnek17
Temat założony przez niniejszego użytkownika
» 2014-04-25 23:13:27
Jak tak robie, to wielkość menu zależy od ilości jego linijek.
P-108697
czosnek17
Temat założony przez niniejszego użytkownika
» 2014-04-25 23:35:06
Chodzi o coś takiego? Jeżeli tak to co dalej z tym zrobić?
<div id= "nowy div ?">
           <div id = "menu">
           menu
           </div>
          
           <div id = "pg">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
           </div>
      </div>
P-108698
« 1 » 2 3
  Strona 1 z 3 Następna strona