Problem z wysokością strony

Oplaner · Czerwiec 12

Witam, mam problem z automatycznym ustawianiem wysokości strony, które jakoś nie działa Ale przejdę do konkretów; robię wpisy na mojej stronie i jest tam tabela z nimi. Wszystko jest ok itd., jednak ta tabela wystaje poza stronę i brzydko to wygląda. Próbowałem dać do ogólnego pojemnika div height:auto ale nic to nie dało. Strona ma się dostosować tak, żeby tabela skończyła się w miejscu, gdzie jest czerwona kreska, a pod tą kreską jeszcze kawałek wolnego miejsca i dopiero koniec elementu. Zdjęcie:

Kod HTML; pozmieniałem dane, ale struktura jest taka sama jak w oryginalnym pliku:

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; 
&lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"&gt; 
&lt;head&gt; 
//zawartość head
&lt;/head&gt; 
&lt;body&gt; 
&lt;center&gt;
&lt;div id="page"&gt; //element zawierający całą stronę
//linki do podstron
&lt;div id="menu"&gt;
//menu
&lt;/div&gt;
&lt;div id="main"&gt; //rozpoczęcie treści strony
&lt;div id="welcome"&gt;
//dane na temat użytkownika
&lt;/div&gt;
&lt;div id="newsbox"&gt; //wpisy; trochę dane tutaj pozmieniałem, ale struktura jest taka jak w oryginalnym pliku
&lt;h1&gt;Aktualności&lt;/h1&gt;
&lt;form action="wpis.php" method="post"&gt;
&lt;input type="hidden" name="wpis" value="TRUE" /&gt;
&lt;p&gt;Wpisz coś: &lt;input type="textarea" name="tekst" size="50" /&gt;&lt;input type="submit" value="Wyślij" /&gt;&lt;br /&gt;
&lt;span style="font-size: 12px;"&gt;Wskazówka: możesz używać &lt;a href="effects.php"&gt;efektów tekstowych&lt;/a&gt; i &lt;a href="minki.php"&gt;minek&lt;/a&gt;.&lt;/span&gt;&lt;/p&gt;
&lt;/form&gt;
&lt;table border="0" cellspacing="12px;" width="530px" style="font-weight: bold;"&gt; 
&lt;tr&gt; 
&lt;td style="text-align: center; vertical-align: top;" nowrap="nowrap"&gt;&lt;img src="obrazek.jpg" alt="" /&gt;&lt;br /&gt;&lt;span style="color: green;" class="bold"&gt;•&lt;/span&gt; &lt;a href="profile.php?id=Tester"&gt;Tester&lt;/a&gt;&lt;/td&gt;&lt;td style="vertical-align: top; font-weight: normal;"&gt;&lt;i&gt;Kolejny&lt;/i&gt; &lt;u&gt;test&lt;/u&gt; &lt;b&gt;wpisów&lt;/b&gt; &lt;b&gt;&lt;i&gt;&lt;u&gt;Computer Quizzer&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;img src="icon1.gif" alt="" /&gt;&lt;br /&gt;&lt;span style="color: grey; text-align: left;"&gt;&lt;i&gt;-16:22:27,&lt;br /&gt;07.06.2011&lt;/i&gt;&lt;/span&gt;&lt;/td&gt; 
&lt;/tr&gt; 
&lt;tr&gt; 
&lt;td style="text-align: center; vertical-align: top;" nowrap="nowrap"&gt;&lt;img src="obrazek.jpg" alt="" /&gt;&lt;br /&gt;&lt;span style="color: green;" class="bold"&gt;•&lt;/span&gt; &lt;a href="profile.php?id=Tester"&gt;Tester&lt;/a&gt;&lt;/td&gt;&lt;td style="vertical-align: top; font-weight: normal;"&gt;&lt;i&gt;Kolejny&lt;/i&gt; &lt;u&gt;test&lt;/u&gt; &lt;b&gt;wpisów&lt;/b&gt; &lt;b&gt;&lt;i&gt;&lt;u&gt;Computer Quizzer&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;img src="icon1.gif" alt="" /&gt;&lt;br /&gt;&lt;span style="color: grey; text-align: left;"&gt;&lt;i&gt;-16:22:27,&lt;br /&gt;07.06.2011&lt;/i&gt;&lt;/span&gt;&lt;/td&gt; 
&lt;/tr&gt; 
&lt;tr&gt; 
&lt;td style="text-align: center; vertical-align: top;" nowrap="nowrap"&gt;&lt;img src="obrazek.jpg" alt="" /&gt;&lt;br /&gt;&lt;span style="color: green;" class="bold"&gt;•&lt;/span&gt; &lt;a href="profile.php?id=Tester"&gt;Tester&lt;/a&gt;&lt;/td&gt;&lt;td style="vertical-align: top; font-weight: normal;"&gt;&lt;i&gt;Kolejny&lt;/i&gt; &lt;u&gt;test&lt;/u&gt; &lt;b&gt;wpisów&lt;/b&gt; &lt;b&gt;&lt;i&gt;&lt;u&gt;Computer Quizzer&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;img src="icon1.gif" alt="" /&gt;&lt;br /&gt;&lt;span style="color: grey; text-align: left;"&gt;&lt;i&gt;-16:22:27,&lt;br /&gt;07.06.2011&lt;/i&gt;&lt;/span&gt;&lt;/td&gt; 
&lt;/tr&gt; 
&lt;tr&gt; 
&lt;td style="text-align: center; vertical-align: top;" nowrap="nowrap"&gt;&lt;img src="obrazek.jpg" alt="" /&gt;&lt;br /&gt;&lt;span style="color: green;" class="bold"&gt;•&lt;/span&gt; &lt;a href="profile.php?id=Tester"&gt;Tester&lt;/a&gt;&lt;/td&gt;&lt;td style="vertical-align: top; font-weight: normal;"&gt;&lt;i&gt;Kolejny&lt;/i&gt; &lt;u&gt;test&lt;/u&gt; &lt;b&gt;wpisów&lt;/b&gt; &lt;b&gt;&lt;i&gt;&lt;u&gt;Computer Quizzer&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;img src="icon1.gif" alt="" /&gt;&lt;br /&gt;&lt;span style="color: grey; text-align: left;"&gt;&lt;i&gt;-16:22:27,&lt;br /&gt;07.06.2011&lt;/i&gt;&lt;/span&gt;&lt;/td&gt; 
&lt;/tr&gt; 
&lt;tr&gt; 
&lt;td style="text-align: center; vertical-align: top;" nowrap="nowrap"&gt;&lt;img src="obrazek.jpg" alt="" /&gt;&lt;br /&gt;&lt;span style="color: green;" class="bold"&gt;•&lt;/span&gt; &lt;a href="profile.php?id=Tester"&gt;Tester&lt;/a&gt;&lt;/td&gt;&lt;td style="vertical-align: top; font-weight: normal;"&gt;&lt;i&gt;Kolejny&lt;/i&gt; &lt;u&gt;test&lt;/u&gt; &lt;b&gt;wpisów&lt;/b&gt; &lt;b&gt;&lt;i&gt;&lt;u&gt;Computer Quizzer&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;img src="icon1.gif" alt="" /&gt;&lt;br /&gt;&lt;span style="color: grey; text-align: left;"&gt;&lt;i&gt;-16:22:27,&lt;br /&gt;07.06.2011&lt;/i&gt;&lt;/span&gt;&lt;/td&gt; 
&lt;/tr&gt;  
&lt;tr&gt; 
&lt;td style="text-align: center; vertical-align: top;" nowrap="nowrap"&gt;&lt;img src="obrazek.jpg" alt="" /&gt;&lt;br /&gt;&lt;span style="color: green;" class="bold"&gt;•&lt;/span&gt; &lt;a href="profile.php?id=Tester"&gt;Tester&lt;/a&gt;&lt;/td&gt;&lt;td style="vertical-align: top; font-weight: normal;"&gt;&lt;i&gt;Kolejny&lt;/i&gt; &lt;u&gt;test&lt;/u&gt; &lt;b&gt;wpisów&lt;/b&gt; &lt;b&gt;&lt;i&gt;&lt;u&gt;Computer Quizzer&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;img src="icon1.gif" alt="" /&gt;&lt;br /&gt;&lt;span style="color: grey; text-align: left;"&gt;&lt;i&gt;-16:22:27,&lt;br /&gt;07.06.2011&lt;/i&gt;&lt;/span&gt;&lt;/td&gt; 
&lt;/tr&gt;  
&lt;/table&gt;
&lt;p style="text-align: right;"&gt;&lt;a href="wpisy.php"&gt;Zobacz więcej wpisów -&gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/center&gt;
&lt;/body&gt;
&lt;/html&gt;

I kod CSS (tylko potrzebne fragmenty):

body {
    background: #000000 url('tlostrony.jpg') repeat-x;
    font-family: Tahoma, sans-serif;
    position: relative;
    margin: 0;
    padding: 0 0 20px;
}

#page {
    margin: 0 auto;
    background: #E6E6E6;
    padding-top: 110px;
    padding-bottom: 15px;
    width: 1000px;
    min-height: 890px;
    height: auto;
    -webkit-radius: 0px 0px 15px 15px;
    -moz-border-radius: 0px 0px 15px 15px;
    -o-border-radius: 0px 0px 15px 15px;
    border-radius: 0px 0px 15px 15px;
}

#main {
    padding-left: 15px;
    padding-right: 15px;
    font-size: 19px;
}

#welcome {
    position: absolute;
    width: auto;
    height: auto;
    margin-left: 120px;
    font-weight: bold;
}

#newsbox {
    width: 550px;
    height: auto;
    float: right;
    margin-right: 100px;
    padding: 0;
    font-weight: bold;
    margin-top: 0px;
}

Mam nadzieję, że uda się komuś rozwiązać ten problem :unsure:

Jak coś źle wytłumaczyłem itp. to proszę pisać.

Oplaner · Czerwiec 12

Problem rozwiązany, temat do zamknięcia

Zaloguj się

Problem z wysokością strony

Recommended Posts

Oplaner

Link do komentarza

Udostępnij na innych stronach

Oplaner

Link do komentarza

Udostępnij na innych stronach

Join the conversation

Przeglądaj

Aktywność