demonhale — Wed, 25 Apr 2007 05:51:18 +0000

It does add up with equal height, but equalizes when the font value is smaller... Glad I could help... Have A Nice Day!

The Coder — Tue, 24 Apr 2007 18:12:11 +0000

Awesome, It worked. But with font size smaller that 8px. On 8px it reduces the height but not exactly to 8px. Making font size smaller that 8px makes it 8 px....

Thanks
God Bless You!!!!

brady.k — Tue, 24 Apr 2007 11:58:48 +0000

There you go. I was just about to write something for you.

Try that and see if it works.

demonhale — Tue, 24 Apr 2007 07:25:32 +0000

Call this the demonhale Box... Hack

Explanation:

Since the height you want is lower than the default sizes defined on your css... The appropriate hack is to force it to read the exact height by adding a property with a "real" height rather than the container properties of the div.

In your CSS:

#spacer4 {
	float: left;
	height: 8px;
	width: 501px;
	background-color: rgb(140,174,201);
	background-image: url('images/stylo.jpg');
	background-repeat: no-repeat;
}

#spacer5 {
	float: left;
	height: 8px;
	width: 777px;
	background-color: rgb(20,54,92);
}

'
.
.
Add this...

#spacer4 {
	float: left;
	height: 8px;
        <strong>font-size:8px;</strong>
	width: 501px;
	background-color: rgb(140,174,201);
	background-image: url('images/stylo.jpg');
	background-repeat: no-repeat;
}

#spacer5 {
	float: left;
	height: 8px;
        <strong>font-size:8px;</strong>
	width: 777px;
	background-color: rgb(20,54,92);
}

The Coder — Tue, 24 Apr 2007 04:13:07 +0000

Thanks a lot for the posting these links!!! Yes, I tried the page with padding set to zero but still it did not work.

And thanks for helping!!!

Best Regards,
Haider Hameed

brady.k — Mon, 23 Apr 2007 20:14:20 +0000

Good guess then, huh?

I'm in between classes and lab, so I can only post some references at the moment. I would suggest reading some articles on sitepoint.com and alistapart.com on CSS. These are the two sites where I learned everything I know and use about CSS (in addition to the documentation at [url]www.w3.org)[/url], so you should have alot of reading!

I'll be back later with some possible fixes / tweaks on your code, but if you figure anything out using what I gave you, post the new code, and the augmented results / problems.

Good luck

The Coder — Mon, 23 Apr 2007 20:03:13 +0000

Thanks for the reply. Firstly the div that are causing problem are with the id "spacer4" and "spacer5"!!!

I posted the same message in another forum. The people on that forum also suggested me to reduce the number of DIVs. I am new to this CSS design. Before this I used tables for web layout. Could you please tell me how to reduce the umber of DIVs that I use. Plus tell me some helpful sources on net to polish my new skills...

brady.k — Mon, 23 Apr 2007 13:37:19 +0000

I'm not sure which 'div' you're talking about, so I can't be specific.

But I do know this:
-try specifying padding values of 0, sometimes that helps
-why are you using so many empty divs? can't they be combined into just a few, using padding values? possibly even get rid of the empty divs? the only time I use an empty div is if (a) it has a background-image, or (b) it's where some content is going to appear dynamically

Try those two suggestions, and see what happens.

If you're more specific with which div's you're talking about, maybe we can help more.