HTML Forum

**PN-Matt** · 06-13-2012, 10:45 AM

Would anyone know how to make the background appear more consistent? or neater?

Something that I can add in the main.css file maybe?

There is white space where I just embedded the video.

http://mixedmatt.co.uk/villaringheim/

It looks a mess and I don't know where or what to adjust.

Thank you,

**lizciz** · 06-13-2012, 01:06 PM

I would suggest wrapping your entire content in a container, to which you add your current background image, without repeating. Then make a second version of the background image which doesn't have the tiles in the top, just the lower part of the image, and add that as background to the body.

Something like this:

HTML Code:

<body>
    <div id="wrapper">
        <!-- All your other content here -->
    </div>
</body>

Code:

body {
    background: url(body-bg-lower.jpg);
}

#wrapper {
    background: url(body-bg.jpg) center top no-repeat;
}

**orionoreo** · 06-13-2012, 01:54 PM

as lizciz said:

break the image into two pieces

one is just the flat texture the other is the orange glow at top

**PN-Matt** · 07:22 AM

I have added the code you suggested and it looks the same. Is there something else I could try?

Thank you for your assistance.

EDIT: Didn't read that about the image will do that and update here.

**PN-Matt** · 07:39 AM

I'm lost with what to do with the image. Where to split from?

http://mixedmatt.com/villaringheim/images/body-bg.jpg

Sorry for being a noob and thanks for your patience.

**lizciz** · 06-14-2012, 01:03 PM

You only need to cut off the part of the image that is unique (the top in your case). The rest can be repeated without the human eye noticing it is being repeated.

From the look of your image, I'd say you could cut of 200-300 pixels off the top (with the full width of course) and display in the #wrapper element. The rest of the image is just white (or almost white) background with some dots on it, and could be repeated in the body background.

**orionoreo** · 06-14-2012, 02:07 PM

ok so the image that you currently have, the top 150px needs to go into a new image called body-bg.jpg ... the rest of the image excluding the top 150px needs to be body-bg-lower.jpg

**PN-Matt** · 06-16-2012, 07:32 AM

Thank you guys!

HTML Forum

Find a Professional HTML Freelancer!

FREE Outsourcing eBook!