Fouten in IE (niet in FF)
ik ben redelijk wat vragen beginnen posten afgelopen periode, maar ik ben dan ook een website aan het afwerken.
Dan heb ik heel wat CSS fouten eigenlijk. Mijn website wordt getest in FF, en mijn vriend test deze in IE.
IE geeft wat problemen, FF is oke....
Ter informatie, mijn document bevat een Meyer reset .
Alle problemen
Problemen 1 & 2
In internet explorer
In firefox
Wat valt op?
-> De bovenste box is groter in FF dan in IE. Er word bij berekening van de paddings in IE geen rekening gehouden met de image rechts..
CSS:
.header {
border: 1px solid #000000;
border-radius: 10px 10px 10px 10px;
padding: 20px;
margin: 20px;
}
-> In FF zijn de borders afgerond in IE nergens.
CSS:
.header, .start, .login, .gegevens, .gegevens-controle, .toevoegen, .contact, .footer {
border: 1px solid #000000;
border-radius: 10px 10px 10px 10px;
padding: 20px;
margin: 20px;
}
input {
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #888888;
border-radius: 7px 7px 7px 7px;
color: #222222;
padding: 3px 4px;
}
Probleem 3
In internet explorer:
In firefox:
Wat valt op?
De datumborders lopen tot tegen de naastlopende kolom, dat zou normaal niet mogen.
CSS:
.select {
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #888888;
border-radius: 7px 7px 7px 7px;
color: #222222;
padding: 3px 4px;
}
Ik denk dat dit het een beetje zal zijn voor deze keer, moest ik ineens nog fouten vinden dan meld ik het wel.
Ik dacht dat alle fouten hierboven normaal niet zouden mogen voorkomen, daarom dat ik even op jullie beroep doe. Alvast bedankt!
Vriendelijke groeten,
Olivier Peeters
Gewijzigd op 23/07/2012 16:42:45 door Olivier Peeters
Je eerste vraag:
Code (php)
1
[0-9]{2}+
{2} betekend de [0-9] 2x herhalen en de + betekend de [0-9] 1 of meer keer herhalen. Die spreken elkaar tegen, 1 van de 2 moet weg. Dit geldt ook voor al die andere keren dat je dit fout doet.
De codes zijn aangepast, de images zijn wel zichtbaar nu :-)
Groeten
Gewijzigd op 23/07/2012 16:43:14 door Olivier Peeters
CSS:
>> De bovenste box is groter in FF dan in IE. Er word bij berekening van de paddings in IE geen rekening gehouden met de image rechts..
Misschien dat even je floats clearen helpt
>> In FF zijn de borders afgerond in IE nergens.
Border-radius is een CSS3 property en daarmee in beta fase. Het werkt dus nog niet overal. Merk op dat het in IE9 gewoon hoort te werken. Gooi je CSS ook eens door http://prefixr.com/ zodat je alle benodigde prefixes hebt
>> De datumborders lopen tot tegen de naastlopende kolom, dat zou normaal niet mogen.
Je geeft nergens aan dat dat niet zou mogen. Geef een width mee (of een max-width) of zeg dat hij een variabele width heeft door hem float: left; mee te geven.
Offtopic:
Het was handiger geweest als je 2 topics had geopend...
Bon :-)
Oplossing:
>> Aha, ik wist dat ik iets moest clearen (dacht er juist ook aan). Dus het is zo opgelost:
"<img src="ZWAT1.jpg" style="float:right; height: 75px">
... de tekst ...
<p style="clear: right;"></p>"
>> Ah bon, goed dat ik dit nu weet! Had niet door dat CCS3 in betafase was. Ik zal het zodadelijk eens doen... Wat me recent opviel, de paddings in IE (& het lettertype) zijn anders dan in IE bij de tekstvakken. Hoe komt dit?
>> Opgelost ;-) Waarvoor mijn dank => code:
.select {
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #888888;
border-radius: 7px 7px 7px 7px;
color: #222222;
padding: 3px 4px;
float: left;
}
Vriendelijke groeten,
Olivier