![]() |
|
|
|||||||
| HTML, XHTML & CSS Forum för diskussioner/frågor kring XHTML, HTML och CSS. |
![]() |
|
|
Trådverktyg | Visningsalternativ |
|
|
|
|
#1 |
|
Medlem
Registrerad: 2005-01-18
Inlägg: 118
Lösningar: 0 |
Problem med css och explorer gällande Div-element och dess positionering
Hej på er Coder's!
Har lyckats få min css att passa alla webbläsare förutom IE. Överraskade?? - Ne tror inte det. Jag har en container som innehåller två div element. Dessa två div-element delar på utrymmet. Det vänstra div-elementet visar en bild. Det högra elementet visar en rad text. Så långt inga problem. Men.. I alla webbläsare visas det högra elementet som innehåller textraden på önskvärt sätt som är helt bredvid det vänstra elementet (bilden) på önskvärd marginal från toppen av containern så att textraden ser ut att vara i centrerad höjd till bilden i det högra elementet. I Explorer visas det högra div-elementet en bra bit nedanför det vänstra elementet och mer eller mindre nedanför containern fast det inte borde vara möjligt. Alltså... Så vill jag att explorer ska visa det högra elementet som alla andra webbläsare, men vet av erfarenhet att det är en drömvärld att få det att fungera felfritt i alla webbläsare. Men att det skiljer så radikalt förvånade mig så därför undrar jag vad jag missat när IE inte beter sig så som jag vill? Vad ska jag göra för att resultatet ska bli snarlikt som i övriga webbläsare? PS. Har ändrat samtliga titlar i kodexemplen för att eventuella nybörjare lättare ska förstå felet och kunna åtgärda det ![]() Kod:
#bildOchTextContainer{
width: 100%;
background: url('images/bgArrow_1.png') no-repeat;
background-position: 460px 110px;
float: left;
}
#Annonsbild{
width: 400px;
margin-top: 20px;
float: left;
}
#Annonstext{
width: 500px;
font-size: 22px;
text-align: center;
margin-top: 100px;
margin-left: 50px;
float: right;
}
Kod:
<div id="bildOchTextContaine"> <div id="Annonsbild"><img src="/images/marketing_1.png" /></div> <div id="Annonstext">Vi kan utveckla din hemsida...</div>
__________________
Med vänlig hälsning ---Jonas--- |
|
|
|
|
|
Markerad som löst av supercajo #2 |
|
Forumvärd
Registrerad: 2001-06-14
Ort: Helsingborg
Inlägg: 8 502
Lösningar: 537 |
Du kan börja med att ta bort float left och width på 100% på bildOchTexttContainer, block element tar 100% av dess förälder så du behöver ju inte köra en float på den i huvudtaget
sen byt plats Annonsbild och AnnonsText, float right element skall vara före float left
__________________
"det går inte att lära en gammal norrlänning byta namn på irc" - gammalt kinesiskt uttryck |
|
|
|
|
|
#3 |
|
Medlem
Registrerad: 2005-01-18
Inlägg: 118
Lösningar: 0 |
Tackar så mycket för hjälpen!
__________________
Med vänlig hälsning ---Jonas--- |
|
|
|
![]() |
| Trådverktyg | |
| Visningsalternativ | |
|
|