Forum PHP.pl

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: DIV-y

Forum PHP.pl > Forum > Po stronie przeglądarki > CSS

magusia

30.05.2007, 10:41:33

Walczę z tym już któryś raz, ale mam już dość rozwiązań połowicznych;)
Mam coś takiego:

[PHP] pobierz, plaintext 
<?php
$r .= '<div id="center_of_page">';
$r .= '<div id="left">';
$r .= $left;
$r .= '</div>';
$r .= '<div id="center">';
$r .= $center;
$r .= '</div>';
$r .= '<div id="right">';
$r .= $right;
$r .= '</div>';
$r .= '</div>';
?>
[PHP] pobierz, plaintext

I style do tego:

Kod

#center_of_page
{
width: 600px;
background-color: #FFAAFF;
}
#left
{
float: left;
width: 200px;
text-align: left;
}
#center
{
float: left;
width: 300px;
text-align: left;
background-color: #FDFDFD;
}
#right
{
float: right;
width: 100px;
text-align: left;
}

Proszę używać bbcode.
poprawiam
revyag

I zawsze własnie jak mam coś takiego, czyli jakiś div i kilka divów w środku niego z parametrem float, to w ie mi ten zewnętrzny div je ładnie obejmuje, a w ff div wygląda jakby się kończył tam gdzie zaczyna. Jak to zwalczyć? Jak zrobić, żeby te divy zachowywały się identycznie w obu przeglądarkach?

revyag

30.05.2007, 11:21:55

Zapewne nie clear'ujesz kolejnego elementu.

[HTML] pobierz, plaintext 
<div id="center_of_page">
    <div id="left"></div>
    <div id="center"></div>
    <div id="right"></div>
    <br style="clear:both" />
</div>
[HTML] pobierz, plaintext

magusia

30.05.2007, 11:25:27

Cytat(revyag @ 30.05.2007, 12:21:55 )

Zapewne nie clear'ujesz kolejnego elementu.

[HTML] pobierz, plaintext 
<div id="center_of_page">
    <div id="left"></div>
    <div id="center"></div>
    <div id="right"></div>
    <br style="clear:both" />
</div>
[HTML] pobierz, plaintext

Faktycznie działa:) dzięki:)
Mam jeszcze pytanie, czy da się zrobić, żeby jedna z tych kolumn miała taką wysokość jak cały div ten zewnętrzny?

[HTML] pobierz, plaintext 
height:100%
[HTML] pobierz, plaintext

nic nie daje:(
Nie chcę jej ani divowi zewnętrznemu nadawać stałej wysokości, gdyż zmienia się jego zawartość w zależności od podstrony.

revyag

31.05.2007, 10:15:05

Jeśli chodzi o równe wysokości kolumn, to najprostszy sposób według mnie jest taki:

Kod

#center_of_page {
    overflow:hidden;
}
#left,#center,#right {
    padding-bottom:2000px;
    margin-bottom:-2000px;
}

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.