css divy i wielkie problemy

[raf_79]

Witam wszytkich

Pisze sobie stronke i chce żeby była łądnie zrobiona ale mam pewne problemy:(

Chce mieć dwie kolumny i to mi się udało zrobić co widać w kodzie ale mam problem gdyż jak wpisuje do lewej kolumny dłuższy tekst to strona mi się nie "wyciąga" tak samo jak to ma miejsce przy wpisywaniu tekstu po prawej stronie !!! mozecie mi coś podpowiedzieć ??

<div id="kontener_1">
       <div id="kontener_2">
           <div id="menu_l">
               menu
           </div>
           <div id="kontener_3">
               <div id="tresc">
                   tresc
               </div>
               <div id="stopka">
                   stopka                    
               </div>
           </div>
       </div>
       </div>

i css

#kontener_1{
background-image: url(../grafika/tlo.png);	
background-repeat: repeat-y;
}
#kontener_2{
background-image: url(../grafika/menu_lewe.png);	
background-repeat: repeat-y;
}
#kontener_3{
margin-left: 186px;
}
#menu_l{
float: left;
width: 186px;
}
#stopka{
background-image: url(../grafika/stopka.png);
}
#tresc{
padding: 1em 1em 1em 1em;
color: #fff;
}

przypuszczam że chodzi o float:left tylko że jak to można ominąć ??

z góry dzięki za odpowiedź

pozdrawiam

rafał

[weecioo]

przed divem zamykającym lewą kolumnę daj

<div style="clear:both;"><!-- --></div>

i powinno pomóc

[raf_79]

no niestety

jak dałem przed tym divem jak radziłeś nie odnotowałem żadnych zmian

natomiast jakto wkleiłem za zamknięciem to się zaczeło poprawnie wyświetlać znaczy dół miałem równy ale tekst w treści mi zjechał pod to co jest w menu

więc dalej walcze

[shpyo]

Może dałbyś to jakoś bardziej czytelne?

Czego tam tłami są obrazki, jeżeli chcę CI pomóc, wklejach kod, style i widzę wszystko białe :/

Wrzuć to gdzieś na sieć - napewno więcej osób Ci pomoże, są przecież specjalne narzędzia, które pomogają bardzo htmlowcom.

Jeżeli opisujesz konkretny problem, to daj przykład z konkretnym problemem.

[raf_79]

oki przepraszma już się poprawiam

przykład pierwszy więcej tekstu po prawej i stronka wyciąfga się jak trzeba

przykład 1

no i drugi przykład w menu wiecej pozycji niż tekstu na stronie

przykład 2

a chodzi o to żeby niezaleznie gdzie bedzie więcej tekstu wygladało jak w przykłądzie pierwszym

[shpyo]

body{
margin: 0;
padding: 0;
font-size: 95%;
font-family: georgia, times, "times new roman", serif; 
color: #000;
background-color: #E7E7DD;
}

a:link {
color: #036;
}

a:visited {
color: #066;
}

a:hover ,a:active {
color: #fff;
background-color: #036;
}

div{

}

#kontener_gl{
width: 794px;
margin-left: auto;
margin-right: auto;
}

#baner{
background-image: url(../grafika/gora.jpg);
height: 143px;
}

#menu_gl{
background-image: url(../grafika/menu_poziome.jpg);
height: 30px;
}	

#kontener_1{
background-image: url(../grafika/tlo.png);	
background-repeat: repeat-y;
}
#kontener_2{
background-image: url(../grafika/menu_lewe.png);	
background-repeat: repeat-y;
}
#kontener_3{

}
#menu_l{
float: left;
width: 186px;
}
#stopka{
clear: both;
/* TU TŁO POWTARZAJĄCE SIĘ OSI Y jak w menu_l */
background: #000 url(../tlo_jak_w menu_l.jpg) repeat-y; 
}
#tresc{
padding: 1em;
margin-left: 186px;
color: #fff;
}

wklej ten kod css - powinno działać

[raf_79]

powinno i działa ale tylko pod FF:( pod ie coś nei wyświetla wszystkiego tutaj przykład

ale dzięki za pomoc to takie proste rozwiazanie a nie wiem czy bym na nie wpadł

pozdrawiam

[zerocool]

Spróbuj zrobić w ten sposób :

https://www.ecv1457.2-ec.com/testy/3div2.html

to moja wersja

[raf_79]

no dzięki wielkie przetestuje

a mozecie mnei uswiadomić w jednej sprawie jeszcze

bo kiedyś używałem sobie słówka class ale poczytałem torszke i tam wszycy używali id czym to się różni ?? i co lepiej stosować bo jakoś nei potrafie tego nigdzie doczytać

EDIT

posprawdzałem i niestety u Ciebie też wyraz treść w drugim przypadu nei jest wyświetlany przynajmniej u mnie może ja mam coś z kompem ??

[zerocool]

wyraz treść w drugim przypadu nei jest wyświetlany

zależy w którym miejscu popatrz łaskawie w źródło strony.

Drugi przykład (ten na dole) to jest wersja kiedy po lewej ( w menu ) masz dużo tekstu, przykład pierwszy to wersja w której masz dużo tekstu po prawej ( w treści strony ).

A to że nie wyświetla się text po prawej u mnie jest spowodowane faktem że go tam nie ma po prostu.

[bellois]

Hmmm. Prosty kod CSS:

.clear {
clear: both;
}

I prosty kod HTML wstawiony tuż przed stopką:

<div class="clear"></div>

I całość działa nawet w IE. Jako dowód przedstawiam zrzut ekranu z browsershots.org

[vel]

i co ważne, co "clearowania" dobrze jest korzystać właśnie z wersji przedstawionej przez belloisa, a to dlatego, że działa ona w IE 7. w sieci można spotkać przykłady tzw. szybkiego cleara, który bazuje na pseudoklasie :after i stosownym hacku do IE. niestety ten trick nie działa już z IE 7, więc warto o tym wiedzieć

[raf_79]

zależy w którym miejscu wink.gif popatrz łaskawie w źródło strony.

Drugi przykład (ten na dole) to jest wersja kiedy po lewej ( w menu ) masz dużo tekstu, przykład pierwszy to wersja w której masz dużo tekstu po prawej ( w treści strony ).

A to że nie wyświetla się text po prawej u mnie jest spowodowane faktem że go tam nie ma po prostu.

nie no prosze cię a ten wyraz treść ten jeden jedyny w drugim przykładzie ?? to po prawej stronie ?? w FF jest tam !! w kodzie zresztą też no i o ten wyrazmi chodzi

bellois wielkie dzięki działa chociaż sie zastanwiam bo wcześniej też próbowałem z clear: both; i jakoś nie bardzo hmm no niewazne grunt że jest oki jeszcze raz wielkie dzięki wszystkim za pomoc

[zerocool]

to po prawej stronie ?? w FF jest tam !!

no to jak jest to co mówisz że się nie wyświetla