Forums

yabune

Hi,

I'm using the 960 framework but I'm having a problem with the contents div, it doesn't expand to fit the contents, the text goes over the footer...

In html I have:


<div id=\"contents\">
	<div class=\"container_12\">
		<div id=\"texts\" class=\"grid_12\">
				<h1>Heading 1</h1>
				<p>Lorem ipsum dolor sit amet, <a href=\"#\">consectetur adipiscing</a> elit. Nunc eu tortor ac mi pulvinar eleifend. Nulla facilisi.</p>
		</div>
	</div>
</div>

And in css I have:


div#contents {
	background-color: #FFFFFF;
}

div#texts {
	text-align: left;
}

Any help on this? Thank you!

TheDoc

What are the styles for "container_12" and "grid_12"?

One of my biggest gripes with the 960 grid is that people that don't necessarily know what they're doing don't change the names. "Container_12" is absolutely meaningless, the names should be "main-content", "side-bar", "header", "footer", "twitter-feed", etc etc.

The 960 idea is great, and that's what I use as a max width for all of my sites, but I think downloading the frame work is a waste of time...

I will end my tangent there.

It sounds like you have something floated that you haven't cleared. Try adding <div style="clear:both"></div> after the content and see if that helps.

Also, if you could provide a working link, you would get immediate help/results!

yabune

ok, here is a link:

http://www.crescendomusical.net/teste54 ... anhia.html

Thank you for your help!

yabune

Ok, I found the problem...

I'm using 960 framework with multiple containers, and inside each container I only use one grid full width.
As I have only one grid for each container I though I didn't need any clear floats, but I was wrong, as each grid is floated...

So I just had to add <div class="clear"></div> after each <div class="grid_12">...</div> and now it's working!

treehouse : what would you like to learn today?

Forums

[solved] div doesn't expand to fit contents