[HTML][CSS] Divy w Divie Opcje

[orange_91]

hey.,
Trochę siędzę i się męczę z czymś dość prostym.
Mam div tresc, a w tym dive mam div x1 oraz div x2, w tych divach jest wyświetlany teskt - i tu uwaga wysokość jest zależna od ilości tekstu.
A teraz problem z div tresc - czemu div x1 i div x2 uciekają z div tresc (IMG:style_emoticons/default/questionmark.gif) Div tresc się kończy i to dość szybko (IMG:style_emoticons/default/tongue.gif) .
wygląda to tak :

(IMG:http://power-design.pl/rozpiernicz/bad.jpg)


tak to mniej wiecej wyglądać powinno - na obrazku jest bez tereści. - zaznaczone są elemnty wyglądu za jakie są odpowiedzialne napisane divy,
(IMG:http://power-design.pl/rozpiernicz/beok.jpg)

i efekt na drugim obrazku został uzyskany za pomocą height dla div tresc, ale twarde ustawienie w px (wartość auto też nie pomaga) , nie rozwiązuje sprawy bo on musi być zależy od div x1 lub / oraz x2.

o to kawałki kodu:

Kod

#tresc {
    width:900px;
    background: url(pasex.png) repeat-y;
}

#x1 {
    margin: 0px 5px 0px 25px;
    padding:5px;
    width: 190px;
    float: left;
    border-style:solid;
    border-color:#fff #111 #111 #fff;
    border-width:1px;
    background-color:#fff;

}

#x2 {
    margin: 0px 25px 0px 5px;
    padding: 5px;
    width: 626px;
    float:right;
    border-style:solid;
    border-color:#fff #f70 #f70 #eee;
    border-width:1px;
    background-color:#fff;
    color:#110;

}

a tu jak to wygląda w html który jest php (IMG:style_emoticons/default/tongue.gif)

Kod

<div id="tresc">
            <div id="x1">
            <?php include 'pak1.php'; ?>
            </div>
            
            <div id="x2">
            <h4>Ble ble</h4>
            <?php include 'pak1.php'; ?>
            </div>
        
        
        </div>
        
        <div id="stopka">
        
        </div>

[cniak]

[HTML] pobierz, plaintext 
 
#tresc {
	width: 990px;
	overflow: auto; 	
}
#x1 {
	width: 600px;
	float: left;
	display: inline;
	position: relative;	
 
}
/** MENU **/
#x2 { 
 display: inline;
 width: 195px;
 float: right;
}
.clear {
        content: ".";
	display: block;
}
[HTML] pobierz, plaintext 

tresc html

[HTML] pobierz, plaintext 
    <div id="tresc">
<div id="x1">
lewa strona
 
<div class="clear"> </div>
 
 
    </div>
	<div id="x2">
prawa strona
      <div class="clear"> </div>
    </div>
	</div>
[HTML] pobierz, plaintext 

Ten post edytował cniak 2.11.2010, 10:11:30