CODEWITHSUNDEEP
css
Grey-lover
Grey-lover

Reputation: 633

Background not showing on whole div?

This is what I want to achieve: enter image description here

This is what I have achieved: enter image description here

For some reason, the background won't show on the whole area. The page is live at http://goo.gl/K17Fjs

<div id="overview">
<img src="images/home-layout_17.png" alt="">
<div id="overview-text">
<h1>Overview</h1>
<p>Salem Al Hajri is a Company, registered under Qatar law, providing services in building construction, maintenance and manpower supply.</p><p>The main business of the company is to provide well trained, experienced, dedicated and hard working workers to the client. We will mobilize the construction workforce you need, for long or short-term projects, anywhere in the Qatar. Our team of construction professionals offers a single-source solution for all of your construction-related needs whether its restoration, site preparation, a new facility or facility renovation, we have the experience and personnel to provide the highest quality... Read More.</p>
</div>
</div>

My CSS:

h1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 28px;
font-weight: normal;
color: #53504a;
}
#overview {
background-color: #f6f6f6;
border: 1px solid #dbdada;
border-radius: 10px;
margin-top: 21px;
padding: 12px;
}
#overview img { float: left;}
#overview-text { float: left; width: 650px; padding-left: 12px}

Upvotes: 0

Views: 35

Answers (3)

demonofthemist
demonofthemist

Reputation: 4199

Add <div style="clear:both;"></div> before ending #overview div i.e. right after #overview-text div.

This happens because you are using floated elements & not clearing them. Floated element height is not taken into account to calculate parents height unless you use clear.

Upvotes: 1

nick
nick

Reputation: 3229

Add overflow: hidden;, height: auto; and a width property to #overview

Upvotes: 0

Ayman Safadi
Ayman Safadi

Reputation: 11552

Add overflow: hidden; to your #overview rule.

Also, learn about clearfix.

Upvotes: 1

Related Questions