Home › Forums › CSS › Noob bg image question › Re: Noob bg image question
This is something everyone does now and again… check below
background: url(images/blog_bg_mid) center repeat-y;
text-align: left;
margin:10px 0;
width: 647px;
}
.blog_box_top h3, p {
background: url(images/blog_bg_mid) center repeat-y;
text-align: center;
margin: 10px 10px;
}
Notice you missed off the file extention… blog_bg_mid.png
Also you have not specified the correct path. it should be ../images/blog_bg_mid.png
After fixing that – I can say that it still dosnt work properly – what I would recommend is stucture it either within 3 blocks like this:
<div class="boxtop"> </div>
<div class="boxmid"> <h2>Title for interesting stuff</h2> <p>interesting content</p> </div>
<div class="boxbot"> </div>
Set the background image of the div class’ boxtop and bottom with the corner sections you have, and dont link them in with the <img> tag. then set the background image of your boxmid class with the blog_bg_mid.png.
If you wanted to try something easyer you could have a single box and use the rounded corners JS code – you can find that here: http://malsup.com/jquery/corner/ There are many others, google just gave me that one first.
most browsers support a rounded corner css code – except of course IE…
There are many ways to achieve it, here are some useful tutorials.
http://www.cssjuice.com/25-rounded-corn … -with-css/
The site is coming on well! keep going! :D