ďťż

[HTML/CSS] Strona nie ma height:100%

       

Podstrony


telcocafe

Witam,
W kodzie strony ustawiłem sobie aby szerokość głównego div'a wynosiła 100% (cały ekran) lecz gdy testuję ją pod wszelkimi przeglądarkami to szerokość nie wynosi 100% tylko jest zależna od ilości treści. Wie ktoś w czym tkwi problem? Link: http://www.bmatrix.elsat.net.pl/kopia/ , kod html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="pl"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2"/> <meta http-equiv="Content-Language" content="pl"/> <title>Strona testowa</title> <link rel="stylesheet" href="style.css" type="text/css"/> </head> <body> <div id="all"> <div id="menu"> Pozycja 1 | Pozycja 2 | Pozycja 3 | Pozycja 4 | Pozycja 5 </div> <div id="top"> </div> <div class="text"> <div class="info"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas ante justo, pulvinar aliquet, sollicitudin vitae, tempor at, magna. Sed lobortis varius nulla. Proin fermentum fringilla arcu. Maecenas tincidunt feugiat nunc. In vel sem vel enim congue tempor. Cras rhoncus, quam quis vestibulum eleifend, tortor metus gravida metus, non suscipit dui nibh eget nulla. Sed nec sem. Praesent at odio vitae mauris rhoncus tincidunt. Nam condimentum vehicula nisl. In adipiscing, ipsum id varius vulputate, est massa faucibus risus, eu ultricies felis tellus vitae ligula. Ut nonummy est vitae mi. Maecenas aliquet. Cras eleifend ligula ut diam. Sed et ligula nec enim sollicitudin commodo. Curabitur magna urna, nonummy vel, ullamcorper a, tincidunt quis, dolor. Sed hendrerit, sapien et lacinia ultricies, tellus ipsum viverra magna, a suscipit lacus nisl eu neque. </div> <br /><br /> <?php include 'news.txt'; ?> </div> <div id="bottom"> <div class="text" style="font-size:10px;color:#6D7E4C;"> Pozycja 1 | Pozycja 2 | Pozycja 3 | Pozycja 4 | Pozycja 5 | Administracja | w górę </div> </div> </div> </body> </html>

CSS:

A:link , A:active , A:visited { color: #7E984D; text-decoration: none; } A:hover { color: #6D7E4C; text-decoration: none; } BODY { background-color: #7E984D; margin: 0; font-family: Tahoma; font-size: 12px; padding: 0; } #all { width: 550px; height: 100%; background-color: #f9f9f9; border-left: 4px solid #6D7E4C; border-right: 4px solid #6D7E4C; margin-left: 100px; padding-top: 15px; text-align: center; } #menu { width: 514px; background-color: #7E984D; text-align: right; padding-top: 6px; padding-bottom: 6px; padding-left: 18px; padding-right: 18px; font-size: 11px; font-weight: bold; color: #ffffff; margin-bottom: 5px; } #menu A { color: #ffffff; text-decoration: none; } #menu A:hover { color: #ffffff; text-decoration: underline; } #top { width: 532px; height: 82px; background: url(images/logo.gif) no-repeat; font-size: 40px; text-align: left; margin-left: 18px; } .text { width: 510px; margin-left: auto; margin-right: auto; margin-top: 5px; margin-bottom: 10px; text-align: left; } .info { width: 494px; background-color: #f1f1f1; border-bottom: 4px solid #dddddd; text-align: left; font-weight: bold; padding: 8px; } #bottom { width: 550px; border-top: 1px solid #000000; padding-top: 5px; } .pole { border: 1px solid #7E984D; height: 18px; width: 100px; } .button { border: 1px solid #000000; background-color: #7E984D; color: #ffffff; font-size: 11px; font-weight: bold; margin: 0; margin-left: 4px; }

EDIT:

W sumie to problem rozwiązany, zauważyłem że xhtml poprostu nie bierze pod uwagę height:100% więc zastosowałem to:

html, body { height: 100%; }
Użytkownik bmatrix edytował ten post 19 marzec 2007, 19:14


Spróbuj ustawić position:absolute. Używaj codeboxów.

Height to wysokość, a nie szerokość ;) Width to szerokość ;)

No racja ;P W każdym bądź razie temat można zamknąć.

  • zanotowane.pl
  • doc.pisz.pl
  • pdf.pisz.pl
  • nvm.keep.pl

  • Sitedesign by AltusUmbrae.