Css verschil IE en Firefox en IE8

Door Bas Visscher op 27-01-2009 16:04

711 views

Hallo,
Ik heb een css opmaak die ik gebruik voor mijn site (zie code).
De uitwerking ervan vind je Hier.
De problemen luiden:
-In IE7 lijnt hij wel gecentreerd uit maar in FF en IE8 niet.
-Ik wil in het element "rechtervlak" een background image maar die komt onder de hele content rechts.

Ik heb ook al in de css background-image gebruikt, hij laad de linker goed maar de rechter slecht. daarom heb ik de plaatjes nu gewoon in de html als img staan. daar doet hij het rechtervlak weer fout?

Waar zit mijn fout ? in de css of mijn html?

CODE:


body {
text-align:center; color:#6FFF4F;
background-color: #1F1F1F;
margin-left: auto;
margin-right: auto;
margin:0; 
padding: 0; 
border-width: 0px;
border: none ;
}
#linkervlak{ 
float: left;
width: 20%;
height: 100%;
background-repeat:no-repeat;
background-position:right; 
}


#middenblok{
float: left ;
width: 60%;
height: 98%;
text-align:left; color:#6FFF4F;
font-family: "Comic Sans MS";
background-color: #333333;
margin-left: 0px ;
margin-right: 10px ;
background-repeat:no-repeat;
background-position:left;
}

#rechtervlak{
float: right;
width: 20%;
height: 100%;
background-repeat: no-repeat;
}

<!-- OPBOUW HTML DIVS -->
<div id="linkervlak">
<!--linkervlak img -->
</div>

<div id="middenblok">
</div>

<div id="rechtervlak">

</div>

Help mij aub.

- SanThe -

27-01-2009 17:03

Maak je code valid.

HTML: 3 Errors, 3 warning(s)
CSS: 6 errors

Bas Visscher

27-01-2009 17:10

Hoe controleer ik de css?

ik heb de 3 errors gewijzigd, dit kwam omdat ik een waarde meegaf in een link.
Jammer genoeg lost dit niets op. het staat wel leuk hoor xhtml. maar ik snap nog steeds niet wat ik fout doe.
bedankt in ieder geval.

EDIT:
Ooh ik zie dat ze ook een css validator hebben die errors ga ik nu fixen.

- SanThe -

27-01-2009 17:13

HTML: http://validator.w3.org/
CSS: http://jigsaw.w3.org/css-validator/

Bas Visscher

27-01-2009 17:15

Ok dit heb ik ook gefixt en het helpt echt niets.
Weet je misschien of ik nog meer dingen fout doe?

de divs komen in widht gewoon op 100% (20+60+20). dus hij zou het toch gewoon moeten doen? (wat hij dus niet doet.)

ok in IE lijnt hij nu goed uit!
dit kwam doordat ik in de body de paddings en margins heb weggehaalt.
in FF doet hij het nog steeds niet.

EDIT:
Hoe zorg ik ervoor dat als mensen hun favorieten aan hebben staan, de site niet helemaal verkeerd uitlijnd.
want als je op een gegeven moment die balk naar rechts doet verdwijnt het rechtervlak.

Danny

28-01-2009 14:50

Ik heb precies hetzelfde probleem =/ in IE wordt alles wel correct gecentreerd, maar in FF blijft hij aan de linkerkant plakken... Heb de validator gebruikt totdat alles goedgekeurd is, maar nog steeds wilt hij niet centreren in FF, terwijl hij dat wel doet in IE

=((((

Niek Weevers

28-01-2009 15:19

ie kijkt naar text-align op de body, daarom werkt het hier wel.
Voor firefox moet dien je een container om je hele site te hebben, deze moet een breedte hebben en een margin: 0 auto;
Op de body een margin: 0 auto; heeft geen enkele zin

Bas Visscher

28-01-2009 17:26

body {
text-align:center; color:#6FFF4F;
background-color: #1F1F1F;
border:none;
height: 100%;
margin: 0%;
}

dit is mijn body zoals hij nu is.

EDIT:
Hoe zorg ik ervoor dat de zijpanelen kleiner worden als iemand bijvoorbeeld zijn/haar favorieten aanheeft tot bijv. 50%
want mijn opdrachtgever wil graag dat de plaatjes aan de zijkant eerst verdwijnen en daarna pas het midden paneel

Edit2:
Hoe krijgen andere sites het voor elkaar dat hij op elk schermresolutie helemaal gevuld is?
Want nu zie ik dus dat hij op mijn laptop heel mooi is maar op onze pc van 1680x 1050 lelijk word?
doe je dan bij width en heigt pixels ipv % ?
of auto?

Ps raden jullie mij aan om met deze vraag naar een ander forum te gaan?
en zo ja welk?
want ik krijg wel af en toe een reactie maar het lost niet op.

Niet lullig bedoeld, maar bij php of sql vragen kreeg ik binnen 5 min een antwoord en klaar!

Reageren

Inloggen om te reageren