Re: Why doesnt the second row show up?

Al wrote:

Hi ppl,

I have copied some code for a 3 column layout with a banner row at the
top.

I am fiddling with the code and went to add a second banner row but it
did not behave as I expected.

Can someone please explain?

A quick glance: id must be unique on a page, and you have two of them
named "banner".

div id="banner"><h1>banner row1</h1></div

div id="banner"><h1>banner row2</h1></div

Try making one #banner and the other #banner2 or similar.

--
-bts
-This space intentionally left blank.

Could I just make them a class instead?

Well actually I did make them a class but it did not fix the
problem....

-Al

Al wrote:

Could I just make them a class instead?

You could, but a banner area is a major section of real estate on the
page, so I feel that an id is more appropriate.

Well actually I did make them a class but it did not fix the
problem....

Since you only have one style set for these two banner areas, why not
simply put the info for both in the first banner div? Use a bit of
vertical space between...

After another glance at your code (I didn't copy it to a real page),
it looks as if you have a 40px high banner and content that is:

position: absolute;
top:50px;

...so any second banner space is going to be under/behind the content.

Change those "top: 50px" to .. 150px ? See what happens.

--
-bts
-This space intentionally left blank.

Yep - got it sussed now. This CSS takes a bit of getting used to but I
can see its advantages.

-Al

Al wrote:

Yep - got it sussed now. This CSS takes a bit of getting used to
but I can see its advantages.

It's a mindset. <g> So, we gather the positioning was the solution?

Look into setting the sizing of divs, and positioning, by using em
units instead of px, and your design will float and properly expand
when a visitor changes font sizes.

--
-bts
-This space intentionally left blank.