Q: Div tags driving me crazy.

Hi!

I am going nuts on this DIV tag.

I got this inside of a <body>

<div id="Products" style="height:500px;">
<div id="ProductGroup" style="float:left;">
Code for displaying groups
</div>
<div id="ProductDetails" style="float:left; padding-left:25px;
width 0px;">
code for displaying product details
</div>
</div>
<div id="Actions" style="padding-top:25px; clear:both;">
a couple of buttons
</div>

when the page is displayed the buttons inside the actions div is not
displayed 500px + 25px down on the page?!?
When the productdetails is filled with data it expands greater then 500px
(if there is much data), how come the
data is not cut?

It doesn't matter if i set scroll to auto on the products div id?

What am i doing wrong.

Also, any hints for a good site where to learn more about div, positioning,
css
I can sence that my knowlage is poor in this subject :(

Regards
Martin

> <div id="ProductDetails" style="float:left; padding-left:25px;
> width 0px;">

That should be

width:200px;

> when the page is displayed the buttons inside the actions div is not
> displayed 500px + 25px down on the page?!?

It is for me. What brower you using?

> When the productdetails is filled with data it expands greater then 500px
> (if there is much data), how come the
> data is not cut?

IE will grow the div so that it still contains the data, FireFox will let
the data "spill out" of the div. To amend this behaviour you need to set
the overflow property.

overflow:hidden

the above will just cut off any data higher than 500px. Or you could;

overflow:scroll

If you want it to scoll instead.

> It doesn't matter if i set scroll to auto on the products div id?
>
> What am i doing wrong.
>
> Also, any hints for a good site where to learn more about div,
> positioning, css
> I can sence that my knowlage is poor in this subject :(
>
> Regards
> Martin
>
>

With one caveat, I recommend "Prof ASP.NET 2.0 Design - CSS, Themes, and
Master Pages".

The caveat is that the author could have condensed this book to about half
it's published size. There is a lot of rambling, apologizing, etc. wrapped
around the meat.

OTOH, this book has a lot of great info I haven't seen covered elsewhere.
It has been very helpful.

"Martin Arvidsson, Visual Systems AB" <martin.arvidsson [at] vsab.net> wrote in
message news:OxF$9%238mIHA.4208 [at] TK2MSFTNGP02.phx.gbl...
> Hi!
>
> I am going nuts on this DIV tag.
>
> I got this inside of a <body>
>
> <div id="Products" style="height:500px;">
> <div id="ProductGroup" style="float:left;">
> Code for displaying groups
> </div>
> <div id="ProductDetails" style="float:left; padding-left:25px;
> width 0px;">
> code for displaying product details
> </div>
> </div>
> <div id="Actions" style="padding-top:25px; clear:both;">
> a couple of buttons
> </div>
>
> when the page is displayed the buttons inside the actions div is not
> displayed 500px + 25px down on the page?!?
> When the productdetails is filled with data it expands greater then 500px
> (if there is much data), how come the
> data is not cut?
>
> It doesn't matter if i set scroll to auto on the products div id?
>
> What am i doing wrong.
>
> Also, any hints for a good site where to learn more about div,
> positioning, css
> I can sence that my knowlage is poor in this subject :(
>
> Regards
> Martin
>

Q: Div tags driving me crazy.

Re: Div tags driving me crazy.

Re: Div tags driving me crazy.