Reactie hoogte (CSS)

uhm,

Kan je dit iets beter toelichten met misschien een klein code voorbeeld van wat je al hebt?

Ok,

<?php
echo '<div id=\'reactie\'>';
echo '<div id=\'linksreactie\'>';
echo '<div id=\'reactieid\'>'; 
echo  $id;
echo '</div>';
echo '<div id=\'persoonid\'>';
echo	'<a href=\'/forum/files/gebruikers.php/'.$userid.'/\'>'.$naam.'</a>';
echo '<br />';
echo  $posts.' posts';	
echo '</div>';
echo '</div>';
echo '<div id=\'rechtsreactie\'>';	
echo '<div id=\'reactietijd\'>';	
echo $datum;
echo '</div>';
echo '<div id=\'reactietekst\'>';	
echo $tekst;	
echo '</div>';
echo '</div>';
echo '</div>';
?>

CSS:

#reactie
{
 		 margin-top			        : 10px;
		 margin-left		                : 25px;
		 width					: 550px;
		 border					: 1px solid #aaa;
		 display				        : block;
}
#linksreactie
{
		 height	 				: 150px;
		 width	 				: 100px;
		 border-right		                : 1px solid #aaa;
		 background-color                      : #ccc;		 
}
#rechtsreactie
{
		 margin-top			: -150px;
		 float					: right;
		 width				: 447px;

		 
}
#reactieid
{
                 font-weight		: bold;
}
#reactietijd
{
		 text-align			: right;
		 font-size			: 8pt;
		 border-bottom	        : 1px solid #aaa;
		 height			: 14px;
		 
}
#reactietekst
{
 		 font-size			: 9pt;
		 height			: 135px;
		 overflow			: auto;
}
#persoonid
{
                 padding-top		: 10px;
		 padding-left		: 10px;
		 text-align			: center;
		 
}

Ik heb het nu met scrollbars opgelost, maar ik wil dat als ik dus een erg grote reactie invoer dat de div groter wordt.

#reactietekst
{
          font-size            : 9pt;
}

Zo dus..

Had ik al gedaan, werkt niet, dan gaat hij buiten de lijnen verder

Buiten welke lijnen?
Overigens, waarom gebruik je negatieve margins?

Bij dynamische content moet je nooit height of negatieve getallen gebruiken (persoonlijke ervaring).

buiten de border van de reactie,
die negative margins had ik omdat anders de rechterkant eronder komt

Plaats links reactie onder recht reactie en geef links reactie de css; margin-right: 450 px..

Edit: Dat hoef je dus niet meer die lelijke negatieve margin te gebruiken..

Edit 2: Haal ook meteen de width er vanaf. (links reactie)

Edit 3: Plaats op #reactie; "overflow: hidden;" en haal dan eens de height van die tekst houder af..

( Een online voorbeeldje zou ook erg handig zijn.. )

Edit 4: Maak er classes van, aangezien je meerdere reactie's gaat maken op 1 pagina, neem ik aan..

Ok, bedankt,

heb je ook een oplossing voor het probleem dat hij bij een te lange tekst gewoon buiten het vak doorgaat ?

==edit==

Top!, doet het nu, bedankt

PS; waarom classes ipv id's ? ikzelf zag het verschil niet

Ivo schreef op 23.10.2008 12:04

Ok, bedankt,

heb je ook een oplossing voor het probleem dat hij bij een te lange tekst gewoon buiten het vak doorgaat ?

Edit 3.. Door die overflow:hidden op "reactie", zorgt hij ervoor dat de floats gecleared worden.

al geedit ;)

waarom classes ipv id's ? ikzelf zag het verschil niet