[HTML][CSS] Złe wyświetlanie DIV-ów, Czyli problemy ze wzrokiem.. Opcje

[Ramzaa]

Nie ma co się rozpisywać, zdjęcie i kod powinno wszystko wyjaśnić.

(IMG:http://img718.imageshack.us/img718/4504/sddb.png)

Kod wygląda następująco:

[PHP] pobierz, plaintext 
<div class="trow1" style="font-size: 11px; width: 190px; padding: 0; float: left;">
	<div style="padding: 5px; background: #dae1e6;">
		<img src="http://www.progames.pl/usr/pic/noavatar.gif"><br/>
		Posty:<br/>
		Grupa: Użytkownicy<br />
		Dołączył: 01.02.2003
	</div>
</div>
 
<div class="trow1" style="width: 791px; padding: 0; float: left; display: inline;">
	<div class="row-p" style="padding: 5px; background: #e8eef2;">
		text posta
	</div>
 
	if (warunek) { 
		$msf->content .= '
</div>
 
<div style="clear: both;">
	<div style="background-color: #dae1e6;">
		Link
		Link 2
	</div>
</div>';
	};
 
$msf->content .= '</div><div class="tcat-bottom" style="clear: both;"></div><br />';
[PHP] pobierz, plaintext 

Chodzi o to, że to ma wyglądać mniej więcej jak to: http://unisolutions.pl/index.php?act=topic...mp;p=1#post6049
To tylko taki przykład.. jakby nie patrzeć.. <zniesmaczony>

I klasy css:

[HTML] pobierz, plaintext 
.trow1 {
	border-top: 1px #9db1c2 solid;
	background: #e8eef2;
	border: 1px #9db1c2 solid;
	border-top: 0; border-bottom: 1px #dce3e8 solid;
	padding: 5px 0px 5px 7px;
	overflow: auto;
	color: #272727;
}
 
.tcat-bottom {
	background-color: #839196;
	height: 3px;
	margin-bottom: 10px;
	display: block;
}
 
.thead {
	border: 1px #9db1c2 solid;
	border-top: 0; border-bottom: 0;
	background: #cbd6db;
	height: 17px;
	padding: 5px 0px 3px 10px;
	font-size: 10px;
	font-weight: bold;
}
 
.trow1 .row-p, .thead .row-p {
	display: block;
	float: left;
	clear: none;
	font-size: 11px;
	color: #525353;
	padding: 0 5px 0 5px;
	text-align: center;
	min-height: 17px;
}
 
.tcat {
	background-color: #0a375c;
	color: #eee;
	padding: 9px 0px 9px 6px;
	margin: 0;
	clear: both;
}
[HTML] pobierz, plaintext 

Zapewne problem jest banalny, a ja z przepracowania już nie widzę.. <zniesmaczony>
Z góry dziękuję za każdą pomoc.

Ten post edytował Ramzaa 18.08.2010, 18:26:38

[Mlodycompany]

w java scripcie to bardzo prosto zrobisz. wystarczy że pobierzesz wysokość jednego diva i ustawisz w drugim.

[Ramzaa]

Ale przecież w css też na pewno się da, tylko że ja już nie myślę trzeźwo.. dlatego zwróciłem się o pomoc.

[Damonsson]

Dajesz to w jednego DIVa i dzielisz na 2 kolejne DIVy. Do tego po prawej dajesz margin left o długości tego lewego DIVa.

[Ramzaa]

Do tego po prawej dajesz margin left o długości tego lewego DIVa.

Ale ten div także ma się rozciągać, tak jak w linku, który podałem, tak ma to wyglądać.

Od nowa postanowiłem to napisać:

[HTML] pobierz, plaintext 
<div style="background: #000; padding: 5px; color: #eee;">
	Nazwa kurwa tematu
</div>
 
<div style="background: #eee; padding: 3px; color: #000;">
	<div style="width: 200px; float: left;">
		xxx
	</div>
	<div style="width="600px; float: left; display: inline;">
		xxx
	</div>
</div>
 
<div style="width: 200px; float: left;">
	<div style="padding: 5px; background: #efedef; width: 200px;">
		<p style="text-align: center;">
			[Awatar]
		</p>
		xxx<br />
		xxx<br />
		xxx
	</div>
</div>
 
<div style="width: 600px; float: left; display: inline;">
	<div style="padding: 5px; background: #efedef; width: 798px">
		xxx - to do samego dołu
	</div>
</div>
 
<div style="background: #000; text-align: right; clear: both;">xxx</div>
[HTML] pobierz, plaintext 

I wygląda to tak:

(IMG:http://img823.imageshack.us/img823/4981/88126366.png)

Z chęcią bym to na tabelach zrobił.. ale nie..

Ten post edytował Ramzaa 18.08.2010, 19:06:40

[Damonsson]

[CSS] pobierz, plaintext 
#glowny {
	background: #00f;
}
#avatar {
	margin-right: 90%;
	background: #0f0;
}
#post {
	width: 90%;
	float: right;
	background: #00f;
}
[CSS] pobierz, plaintext 

[HTML] pobierz, plaintext 
		<div  id="glowny">
				<div id="post">
				Lorem ipsum <br/> 
				Lorem ipsum <br/>
				Lorem ipsum <br/>
				</div>
				<div id="avatar">
				Lorem ipsum <br/> 
				Lorem ipsum <br/>
				Lorem ipsum <br/>
				Lorem ipsum <br/> 
				Lorem ipsum <br/>
				</div>
		</div>
[HTML] pobierz, plaintext 

Chyba nic nie pomyliłem ;P

[Ramzaa]

Damonsson, wielkie dzięki za chęci, ale problem już rozwiązałem. Tzn sam się rozwiązał. Szczerze mówiąc nie wiem jak. Ja tylko przepisałem to od początku. Chyba otrzeźwiałem (IMG:style_emoticons/default/smile.gif)

Ten post edytował Ramzaa 18.08.2010, 19:33:16