Ik heb een probleem met het floaten van mijn div's in een bepaalde situatie die ik niet kan verklaren.
Bij het floaten van mijn div's in een form komen al mijn div's toch onder elkaar te staan.. Ik heb in mijn css aangegeven om te floaten, de breedtes ligt het ook niet aan.. het gekke is dat als ik mijn form er uit sloop een gedeelte wel float. Ik heb nergens anders het probleem gezien en het is ook alleen in IE 7. Ik kon geen oplossing vinden in google of GoT.. dit is de pagina waar het allemaal gebeurd: contactformulier vasili interactive
Om jullie niet te vermoeien hier een uitgeklede versie van de structuur en css. Alle niet relevante zaken dus weggelaten:
HTML:
<div class="content">
<h1>registratie</h1>
<p>Om u snel van dienst te zijn en voor een soepele afhandeling...blabla </p>
<hr class="divideline" />
<form name="frm" action="./formsubmit.php?page=5" method="post">
<div class="formInputs">
...labels en input's
</div>
<div class="formInputs">
...labels en input's
</div>
</form>
</div>
<div class="triggers_right">
<h2>contact</h2>
<p>contactgegevens enzo..</p>
</div>
Het probleem zit dus in het feit dat IE7 de formInputs niet wilt floaten. En de allerlaartste div.. moet floaten naast de 'content'-div. Het is dus een twee-colloms pagina.. links is het formulier dat weer uit twee helfden bestaat... en de rechtercollom is een vakje met contactgegevens.
hier is de CSS:
.content
{
width: 510px; /* 570 */
display: block;
float: left;
}
form
{
display: inline;
}
.triggers_right
{
border: 1px solid #414141;
width: 178px; /* 178 */
display: block;
float: left;
margin-right: 15px;
margin-top: 35px;
}
.formInputs
{
margin-left: 25px;
width: 207px; /* 250 */
float: left;
}
Als iemand weet hoe het zit hoor ik het graag.. een aantal dingen die ik heb geprobeerd:
Bij het floaten van mijn div's in een form komen al mijn div's toch onder elkaar te staan.. Ik heb in mijn css aangegeven om te floaten, de breedtes ligt het ook niet aan.. het gekke is dat als ik mijn form er uit sloop een gedeelte wel float. Ik heb nergens anders het probleem gezien en het is ook alleen in IE 7. Ik kon geen oplossing vinden in google of GoT.. dit is de pagina waar het allemaal gebeurd: contactformulier vasili interactive
Om jullie niet te vermoeien hier een uitgeklede versie van de structuur en css. Alle niet relevante zaken dus weggelaten:
HTML:
<div class="content">
<h1>registratie</h1>
<p>Om u snel van dienst te zijn en voor een soepele afhandeling...blabla </p>
<hr class="divideline" />
<form name="frm" action="./formsubmit.php?page=5" method="post">
<div class="formInputs">
...labels en input's
</div>
<div class="formInputs">
...labels en input's
</div>
</form>
</div>
<div class="triggers_right">
<h2>contact</h2>
<p>contactgegevens enzo..</p>
</div>
Het probleem zit dus in het feit dat IE7 de formInputs niet wilt floaten. En de allerlaartste div.. moet floaten naast de 'content'-div. Het is dus een twee-colloms pagina.. links is het formulier dat weer uit twee helfden bestaat... en de rechtercollom is een vakje met contactgegevens.
hier is de CSS:
.content
{
width: 510px; /* 570 */
display: block;
float: left;
}
form
{
display: inline;
}
.triggers_right
{
border: 1px solid #414141;
width: 178px; /* 178 */
display: block;
float: left;
margin-right: 15px;
margin-top: 35px;
}
.formInputs
{
margin-left: 25px;
width: 207px; /* 250 */
float: left;
}
Als iemand weet hoe het zit hoor ik het graag.. een aantal dingen die ik heb geprobeerd:
- table tot een inline maken
- table collapsen/hiden etc.
- alle floats weggehaalt en alle elementen natuurlijk laten floaten door ze inline te maken.
- form weghalen (dit loste een gedeelte van het probleem op maar dan wil het contactblok nog niet floaten met de 'content-div'. Bovendien kan ik die form natuurlijk niet verwijderen.