Har ett problem med fixed:ad bakgrund i IE och FF. Har du med rätt doctype? <b>Om jag sätter "fixed" på background till en <div> så försvinner bakgrundsbilden i FF</b> Jag använder mig utav denna rad: Sätt positionen för bakgrunden till samma som DIVen:fixed bakgrund med css, konstig lösning?
Om jag sätter "fixed" på background till en <div> så försvinner bakgrundsbilden i FF, men syns i IE och stannar även om man scrollar.
Tar jag bort "fixed", så syns bilden och stannar vid scrollning i FF, men rullar bort i IE vid scrollning
Lägger jag till "background-attachment: fixed;" så blir det samma resultat som "fixed".
Men däremot om jag lägger till två st - framför, "--background-attachment: fixed;", så fungerar det utmärkt i båda webbläsarna. Alltså bilden syns, och stannar trots att man scrollar.
Nån som har en snyggare lösning än detta? För detta kan väl knappast vara den korrekta?
/DSv: fixed bakgrund med css, konstig lösning?
Det brukar vara ett skäl till att det strular mellan FF/IESv: fixed bakgrund med css, konstig lösning?
Om du har satt no-repeat för bakgrunden och angivit positionen 0 0 eller ingen position alls, hamnar bilden längst upp till vänster i webbläsaren, men bara den delen som din DIV överlappar kommer att synas.
Ur specifikationen:
<b>If the background image is fixed within the viewport (see the 'background-attachment' property), the image is placed relative to the viewport instead of the element's padding area.</b>
Sätt bakgrunden för body i stället så syns den och fungerar i både FF och IE.
<code>
<style type="text/css">
/* bg.jpg skall ha en bredd om minst 50px */
body {
background: url(bg.jpg) no-repeat fixed 350px 100px;
}
#bg-on-div {
position: absolute;
left: 200px;
top: 100px;
height: 750px;
width: 100px;
border: 1px solid red;
background: url(bg.jpg) no-repeat fixed 150px 100px
}
#bg-on-body {
position: absolute;
left: 400px;
top: 100px;
height: 750px;
width: 100px;
border: 1px solid red;
}
</style>
<body>
<div id="bg-on-div"></div>
<div id="bg-on-body"></div>
</body>
</code>Sv: fixed bakgrund med css, konstig lösning?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Jo jag använder mig utav no-repeat, och även top left.
Jag vill inte ha bilden som bakgrund i <body>. utan jag behvöer den i en <div>.
Varför fungerar det med -- framför background-attachment?
Har jag förstått det rätt att om en bild är 20x20 px så försvinner den i ett lager med padding:20px om man sätter fixed?Sv: fixed bakgrund med css, konstig lösning?
<code>
<style type="text/css">
#mydiv {
position: absolute;
left: 200px;
top: 100px;
width: 300px;
background: url(bild.jpg) no-repeat fixed 200px 100px;
}
</style>
<div id="mydiv">
...
</div>
</code>
Detta är det korrekta, men det är som vanligt bara FF som klarar det.