Give help. Get help.
I have a problem, I set a background image to repeat in the body and when I make the browser window taller the background images moves, I was thinking that setting the background position to top solve the problem, until I started to add content on differents pages I realize that the background images moves depending on the content, and when I set to bottom the images stay in place no matter how many content I have, but the problem is the same with Safari 3 and IE 7.
You can see my example here: http://mirdum.com/experimentos/test/
works in Firefox 3 +, Safari 4, Camino 1.6.8, Opera and IE8, just make your browser window taller and see that in safari 3 and IE7 the background images moves.
Thanks and sorry for my english.
Not seeing the problem in Safari 4. How about setting boxes.jpg as the background for the body instead of html and then creating a 100% wide div for boxes_top.jpg.
The problem is with safari 3 and internet explorer 7, and I follow your advice and still don’t work the boxes keep moving when I make my browser window taller,
The code that I using is:
Lorem ipsum dolor sit amet…
the live example is here: http://mirdum.com/experimentos/test/
I want to make the bg images stay still like in firefox 3 does
Hi,
Yes i noticed that problem. please remove that bgcolor or Transpernt
body{
background: url(boxes_top.jpg) repeat-x top left;
}
now its working i also checked
Yes i noticed that problem. please remove that bgcolor or Transpernt
body{
background: url(boxes_top.jpg) repeat-x top left;
}
now its working i also checked
The problem is with the boxes.jpg in the html
If I set the background position to top the boxes images move depending on the content and if I set to bottom the boxes stays in place, when I make my browser window taller I can see more boxes, that’s what I want but in safari 3 and ie7 the boxes images moves and I don’t know why? that break the illusion that boxes_top.jpg and boxes.jpg are just 1 image.
I hope that there is a solution for this
It’s not necessary to post the code if you give a working link.
What’s the 50% for?
I think the problem is coming from the padding on the body (I didn’t notice that this morning ‘cos I was in a hurry), take boxes_top.jpg back into photoshop and make it the height you need it to be, then get rid of that padding.
the 50% is for make the background move with the centered container if you take a close look the the text_bottom.jpg it have 2 parts of boxes and that looks like the container is transparent and that is working fine.
I remove the padding and the problem is the same if I set the background posirion to 50% bottom works except in safari 3 and ie7 because the boxes.jpg moves with the window if you change the height of the window and if I set to 50% top , the move problem is gone until I start to add content the boxes move because the height of the html change and it break the
illusion that boxes_top.jpg and boxes.jpg are 1 big image.
I hope that there is a solution for safari 3 and IE7
You must be logged in to reply to this topic.