WeLoveCSS Logo
Home Profile Members Search Rules Help New Posts



WeLoveCSS > WEB DESIGN > CSS > backgrounds overlapping, and not visible under floats

Reply
  Thread Tools Display Modes
Old 31st October 10, 02:08 PM   #1
ChrisML123
WLC Member
 
ChrisML123's Avatar
 
Join Date: Oct 2010
Location: bigonroad
Posts: 7
Default backgrounds overlapping, and not visible under floats

Hey, I'm editing this page - http://names-not-numbers.co.uk/news/

My CSS is:
Code:
/*content*/
#content {
width:989px;
margin: 0 auto;
}
#contentmain{
background-image:url(images/contentbgmain.png);
background-repeat:repeat-y;
margin:0;
}
#contenttop{
background:url(images/contentbgtop.png) no-repeat top;
height:91px;
margin:0;
}
#contentbot{
background:url(images/contentbgbot.png) no-repeat bottom;
height:114px;
clear:both;
}
#contenttext {
padding:0 40px 0 40px;
margin-top:-60px;
margin-bottom:-70px;
width:900px;
}
#contenttextmain {
width:570px;
float:left;
}
#contenttextside {
width: 315px;
float:right;
}
And my HTML is
Code:
<div id="content">
  <div id="contenttop"></div>
    <div id="contentmain">
   	<div id="contenttext"> 
    	   <div id="contenttextmain">
	      main text here
	   </div>
           <div id="contenttextside">
   	      sidebar text here
           </div>
        </div> 
    </div>
    <div id="contentbottom"></div>
</div>
I have two issues. a) why is the background on contentmain not visible.
b) when it is visible, how do i get rid of the overlap in backgrounds between contentmain and contenttop & contentbottom?

Thanks!
Chris
__________________
I’m Chris Lowry, from
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
. Visit my sites for
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
and
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
.
Try
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
charity too! Its an awesome
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
.
ChrisML123 is offline   Reply With Quote
Old 31st October 10, 03:39 PM   #2
ChrisML123
WLC Member
 
ChrisML123's Avatar
 
Join Date: Oct 2010
Location: bigonroad
Posts: 7
Default Re: backgrounds overlapping, and not visible under floats

Any ideas?
__________________
I’m Chris Lowry, from
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
. Visit my sites for
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
and
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
.
Try
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
charity too! Its an awesome
To view links or images in signatures your post count must be 5 or greater. You currently have 0 posts.
.
ChrisML123 is offline   Reply With Quote
Old 31st October 10, 03:51 PM   #3
chrishirst
Banned
 
Join Date: Jun 2006
Location: Blackp ool U.K.
Posts: 3,194
Default Re: backgrounds overlapping, and not visible under floats

Clear the floats so they will be contained by the parent.


Adding overflow: auto; to contentmain should accomplish it.
chrishirst is offline   Reply With Quote
Reply


Thread Tools
Display Modes
Linear Mode Linear Mode

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 04:05 AM.



Home | Advertise | Contact Us | Top
Home | Advertise | Contact Us | Top

Copyright© 2006 WeLoveCSS.com. All Rights Reserved.
Powered by vBulletin Version 3.8.4 Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.