Home/ Questions/Q 8567177
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-11T17:49:22+00:00

I’ve uploaded the website mrandmrsmagic.com, whilst it looks fine when you have it maximized,

  • 0

I’ve uploaded the website mrandmrsmagic.com, whilst it looks fine when you have it maximized, minimized only half of it is shown (I took away the scroll bar because it shows up when it’s maximized so perhaps there’s something loose hanging about it.). The site itself, I used 5 different background images since I sliced them in Photoshop (It’s been awhile since I built a site from ground up so the coding is probably pretty messy.) Below is the css of the 5 div’s that I used for the body.

#body {
width: 1024px;
height: 583px;
marin: 0;
padding: 0;
position: relative;
left: 448px;
top: -128px;
background: url(../images/body_02.jpg) no-repeat left top;
}

#body2 {
width: 1024px;
height: 583px;
position: relative;
left: 448px;
top: -128px;
background: url(../images/body2_02.jpg) no-repeat left top;
}

#body3 {
width: 1024px;
height: 583px;
position: relative;
left: 448px;
top: -128px;
background: url(../images/body3_02.jpg) no-repeat left top;
}

#body4 {
width: 1024px;
height: 583px;
position: relative;
left: 448px;
top: -128px;
background: url(../images/body4_02.jpg) no-repeat left top;
}

#body5 {
width: 1024px;
height: 583px;
position: relative;
left: 448px;
top: -128px;
background: url(../images/body5_02.jpg)  no-repeat left top;
}

#body6 {
width: 1024px;
height: 583px;
position: relative;
left: 448px;
top: -128px;
background: url(../images/body6_02.jpg)
}

I tried taking away the height and putting the width at 100%, but then it wasn’t remedied and it almost made it worst. So is there a way to go about switching the css around, where I can keep the 5 divs? Maybe I should make just one initial div tag, then make 5 class tags for the bodies. Would that be possible? Any and all help is appreciated, thanks.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You’re not benefiting at all from making those images backgrounds of <div>s, and you’re probably compounding that trouble by using positioning. Without recoding the whole thing for you, here’s a ‘better’ approach:

    CSS

    <style>
    /* Make your main components all the same width, and center them within <body>. Their heights will expand as needed */
    #header, #cssmenu, #content { width:1024px; margin:0 auto }
    #cssmenu { ... } /* Looks like what you have will work fine */
    /* #body1/2/3/4....not needed */
</style>

    HTML

    <body>
    <div id="header">...</div>
    <div id="cssmenu">...</div>
    <!-- img elements exist for a reason :-) don't be scared -->
    <div id="content"><img src="body2.jpg"></div>
</body>
    • 0