Search the Community

I've been using CSS sprites for a while now, mainly using it for icons, but I want to sprite up my backgrounds too. All the backgrounds I want to sprite I want to repeat Horizontally (left to right) but I can't get it too work. I know you can repeat in one direction only with CSS sprites, but it still wont work. #header {width: 100%; height: 215px;background:transparent url('files/site/spritebg.png') repeat top left; background-position: 0;} .sitemenu {float:left; width:690px; height:35px; color:#FFF; font-size:13pt; background-image:url(files/site/spritebg.png); background-repeat: repeat-x; background-position: 220px 0;} Here's two examples of the codeof two sprites I want to repeat, but both just display the image with huge gaps. Here's a link to the css image: http://i475.photobuc...48/spritebg.png Any help in getting this to work will be great. Its really getting on my nerves now!

Hello, I need help with something i think is quite easy to solve maybe for the real experianced ones. I am a webeditor, but still not professional, and experianced with all sort of css layouts etc. So it about this site: http://mbdbygg.zxq.net/ . I have never maked a background/layout like this before, and am considering some other way to achive how i want it, but i guess i wont need to do it all over. So look at the site: http://mbdbygg.zxq.net/. When you open it in a normal fullscreen window it looks ok, and that is how it is suppose to look. When one minimize the window you can see that the pictures i nthe middle all moves outside the layout to the right on a white surface outside the wrapper! So does the links aswell. And the the "righttext" div moves to the left one. So what do i need to do for it not beeing like this. The divs - header, content, and footer are supposed to be fixed. Meaning there should be repeating the content and the foot and header, and not be pressed to the left like that. What do i need to do? I attach the css file as well. Thanks for any help! style.css

Hi, Can you please help me any one. Problem: I've given background image for the div with repeat-x to show 100% in browser. But when I reisze the browser, horizantal scrollbar will displays in bottom of the browser. When I scroll the horizantal scroll bar the background image not repeating it stoped some position. I don't know why I tried background-size in css3, still not working also I've attached image you can refer that for good understand Is it possible to fix, How? Please tell me anyone with your solutions.

I have been using Positioning and Float to set up a banner. I want to have a fixed height banner (starting at the top of the page) and for this to have: an image located on the left; a background (generated from an img); and a single line of text aligned to the right of it and at the bottom. The html has a div with an id. This div contains the img and that has a class which floats it to the left. This div also contains the text, which is aligned to the right. The external CSS style sheet details the id, which repeats a background img to fill the browser window [repeat-x (doesn't seem to matter if I specify left/right/center)], and the class which floats the image [img.floatLeft], Main Problem: It works, but I can't figure out how to get the line of text, which is happily sitting on the right, to be at the bottom of the div. Isn't align deprecated? I'm confused. Secondary Issue; I read about the CSS background-position Property. I would like to fix the banner at the top of the page independent of scrolling, But I can't make it work with the repeated background image. I also noticed that the size of the image used for the repeat is changed when the div is fixed. I'm viewing it in FF 9.0.1. Thanks in advance.for any help / suggestions