It works perfectly except for one little problem. The background does not resize to the size of the browser window. I have it set at 2560 px width to accommodate the widest screens but on anything smaller I’m getting a horizontal scroll bar. I have nooooooooooo clue how to fix it. If you can help, I would really appreciate if you could be extremely specific as to do with the code as I have a lot of trouble following these comments. I guess I’m just a bit too dense to understand CSS! I also had posted this on another thread and was asked to move it here. Like I said… I’m not the sharpest tool in the shed! :)
You are not dense, just new to the language. We were all there once. Here is what I would suggest for the background…
The bubbles image can be applied to the body as a background image in css. The image looks to be something that repeats, so you could make it much smaller by creating a seamless background and setting it to repeat in the css. This would get rid of the scrollbars and also speed things up.
Here is a snippet of css that would accomplish the repeating background image set to the body.
background: #FFF url(../path_to_image/bubbles1.jpg) top left repeat;
I would also suggest moving all of your css to an external stylesheet. Then, if you need to make a simple change to a style or layout, it only needs to be done in one place.
Sorry for the long winded response. Hope that helps somewhat.