IE Float probleem

[baws]

Hallo,

mijn website draait in alle browsers goed behalve in Internet Explorer.

ik heb 2 divs naast elkaar, 1 div met een afbeelding en daar langs 1 div met text.
ik wil deze divs naast elkaar hebben met float
maar de div #hoofdafbeelding lijkt te verdubbelen in Internet explorer.
als ik element inspecteer en klik op #hoofdafbeelding krijg ik het gedeelte waar de afbeelding in staat.
als ik klik op <img alt="Badkamer" src="/media/img/badkamer/HA178.jpg"/> dan krijg ik de afbeelding en als ik klik op
<div id="hoofdafbeelding"/> dan krijg ik het vak rechts van de afbeelding waar de text div moet komen, zie afbeelding.




mijn css i als volgt.

 #hoofdafbeelding	 {	
		
		 height:400px;
		 width:47%;		 
		 float:left;
		 
	 }
	 
	 #hoofdafbeelding img	 {
		max-width:100%;
		max-height:400px;
	 }
	 
	 #kamertext{
		margin-left:3%;
		padding-left:2%;
		padding-right:2%;
		width:43%;
		height:400px;		
		background-color:#c2c0c0;
		float:left;
		overflow:auto;
		 border:1px solid;
		
	 }

Ligt het aan IE of aan de css/

Ik kan de website url niet geven wegens beveiligings risicos

 

[baws]

#hoofdafbeelding {

max-height:400px;
width:47%;
float:left;

}


ik heb er max-height:400px van gemaakt en werkt nu.

 

[csshunter]

Ligt het aan IE of aan de css?

Nop, aan de html!

• Er zit een <div> binnen een <a> element, dat mag niet.
• Er zijn twéé div's met dezelfde id="hoofdafbeelding", dat mag niet.
• De tweede staat er in als <div id="hoofdafbeelding"/> zonder inhoud en zonder </div>: ook dat gaat fout.

Zei de html-valdidator niets?
Want als een webpagina plots niet doet wat je wilt, ... enz.: zie handtekening!

 

[baws]

Dat viel me ook al op.
echter in mijn php heb ik staan


echo"<a href=\"javascript:void(viewer.show(0))\">";
echo "<div id=\"hoofdafbeelding\">";


echo "<img src=\"$imgpath\" alt=\"Badkamer\" ></a>";
echo "</div></a>";


dus geen 2 divs.
bij chrome en firefox zie ik er ook maar 1 en staat die <div id="hoofdafbeelding"/> er ok niet bij !

Heb het toch maar aangepast naar :

echo "<div id=\"hoofdafbeelding\">";
                echo"<a href=\"javascript:void(viewer.show(0))\">";

        echo "<img src=\"$imgpath\" alt=\"Badkamer\" ></a>";        
        echo "</div>";

 

[Tha Devil]

Chrome bouwt zelf zijn HTML op, aangezien jij een fout in je HTML had probeert hij dat op te vangen, dit was je input eerst:

<a href="javascript:void(viewer.show(0))">
    <div id="hoofdafbeelding">
        <img src="$imgpath" alt="Badkamer" >
    </a>
</div>
</a>

Ziet dit er niet overzichtelijker uit?

echo
'<div id="hoofdafbeelding">
    <a href="javascript:void(viewer.show(0))">
        <img src="'. $imgpath .'" alt="Badkamer" />
    </a>
</div>';

Desnoods uit PHP-modus gaan:

?>
<div id="hoofdafbeelding">
    <a href="javascript:void(viewer.show(0))">
        <img src="<?php echo $imgpath; ?>" alt="Badkamer" />
    </a>
</div>
<?php