webForumDet fria alternativet

Bild drar över div

3 svar · 481 visningar · startad av jwradhe

jwradheMedlem sedan juni 2002711 inlägg
#1

Har ett forumet där jag loopar ut svaren i divvar, divven som svaret ligger i har problem med att om det används en bild så glider den utanför sin egna div och över nästkommande, vilken inte är så bra.
Vill att bilden ska få divven att sträcka på sig.
Men jag får inte till detta. Någon som har nåt bra tips?

Koden:

<div style="background-color: #d3e3bc; min-height:300px; margin-left: 20px; width: 835px; float: left; margin-top: 20px;">	
	<div align="center" style="background-image: url(_themes/img/forum/forum_green_bar.gif); height:24px; color: #FFFFFF;">
		<div style="padding-top: 3px;">
			<font style="font-size:140%; font-weight: bold; margin-left: 10px;"><b>Svar</b></font>
		</div>
	</div>
	<div>  
	
	
	<!-- Loop här -->
	
		<div style="background-color: #dbe5cd; border-bottom: #cccccc 2px solid; height: 300px; min-height: 300px;">
						
			<div style="width: 20%; float: left; background-color: #dbe5cd; height: 100%;">
			<div style="padding: 10px;">

			
				<div style="margin-top: 10px; margin-left: 10px;"> 
					
				</div>
				
				<div style="margin-top: 10px; margin-left: 10px;">

				</div>
				
				<div style="margin-top: 10px; margin-left: 10px; font-size: 13px;">

				</div>
				
				<div style="margin-top: 2px; margin-left: 10px; font-size: 13px;"> 

				</div>
			</div>
			</div>
			
			<div style="width: 80%; float: right; background-color: #eaede6; position: relative; height: 300px; min-height: 300px;">
			<div style="padding: 10px;">
			
				<div style="width: 630px; position: relative; margin-top: 5px;">
					<div style="float: left; width: 70%; text-align: left;">
						
					</div>
					<div style="float: right; width: 30%; text-align: right;">
						
					</div>
				</div>
				
				<div style="position: absolute; top: 33px; background-color: #999999; width: 640px; height: 1px;">&nbsp;</div>
				
				<div style="margin-top: 20px; font-size: 12px;">
				
					<!-- Här skrivs innehållet ut -->
					
				</div>
				
				
			</div>
							
				<div style="position: absolute; right: 20px; bottom: 20px;">
					
				</div>
								
			</div>
			
			<div style="clear: both;">&nbsp;</div>

		</div>	
		

	</div>
</div>
MelittaMedlem sedan sep. 2003448 inlägg
#2

Har du någon skarp version på sidan?

tantenMedlem sedan nov. 20051 596 inlägg
#3

Det var väldans mycket divar. Ser ut som du försöker göre div i stället för <tr> och <td>??
Vad innehåller de sedan?
Med en hastig blick så ser det ut som du har en div under som är absolut och då ser det ut som du har satt stopp för det över att tänjas ut. Men jag kanske tolkar dina style fel
Men om någon nu lägger dit en bild som är större än den höjden du har så är kanske lösningen den att du sätter overflow på ett <p> som bilden ligger i, så det blir en scroll på den.

<p style="overflow:scroll; height:200px;"><img src="bild.jpg" /></p>
Danne VMedlem sedan aug. 20068 090 inlägg
#4

Man kan inte ge ett säkert svar utan all kunna se ALL relevant kod. Och "relevant" betyder ofta även kod som du själv tror är oväsentlig. Det kan t.ex. vara nån generell stil för bilder (margin, padding, float el. dyl) i din stilmall som du missar.

Posta därför ALLT och/eller också en länk till den skarpa versionen (som Melitta skriver) så att man dessutom får se vad du menar och kan rota i bl.a. stilmallar själv.

Annars lär du inte få många svar, och de du får kommer att vara mer eller mindre bra gissningar.

129 ms totalt · 3 externa anrop · v20260731065814-full.3ab8d573
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
126 ms — hämta tråd, inlägg och bilagor (db)