Forum Moderators: not2easy
I'm having some issues with a background in my css.
I have a background for the page specified here:
body {
font: bold 70% Arial, Helvetica, sans-serif;
color:#FFFFFF;
margin:0 auto;
padding:0;
background: #948E7B url(../layout/regular.gif);
min-width:775px; Then I have a div called #arena that wraps around the whole site itself, which has a background of it's own:
#arena {
display:block;
height: 100%;
width:850px;
background: transparent url(../layout/bg.gif) repeat-y;
margin:0 auto;
overflow:hidden;Inside that div I have a div named #box which is what contains all the content for the site:
#box {
display:block;
position:relative;
width:750px;
height: auto;
margin:0 auto;
border-right: 2px solid #8D866C;
border-left: 2px solid #8D866C;
background: #635539;I want the background in #arena to stop making the page scroll at smaller resolutions, I want it to act like a "background" as it should. However, when I specify the width for #arena, it produces a horizontal scroller. But I have to have the width for it to work correctly. I'm missing something here.
Is there a way to get around this? Here is an example: <snip snip>
Thank You!
[edited by: DrDoc at 11:14 pm (utc) on May 4, 2004]
[edit reason] No URLs, thanks. See TOS [webmasterworld.com] [/edit]
Then I have a div called #arena that wraps around the whole site itself, which has a background of it's own:
Not too sure here, but think that if you swapped the backgrounds and sizes on <body> and #arena, it might help. When you say you are "wrapping the whole site" that is the job of the root element = <body>
so body grows and the background can be fixed on this.. #arena stays at fixed size and contains the scrolling div..
or am I not understanding the problem? :)
if not some HTML to go with the above CSS would help ..
Suzy
