Layout

Hello,

I am creating the base design of a web site that consists in two
horizontal bars: Navigation and Intro.

"Navigation" will contain the menu.

"Intro" will contain two items: a logo (image) on the left and a
banner (flash) on the right.

In this moment I have the following:
http://www.27lamps.com/Beta/Bar/Bar.html

I am not sure if using a background image is the best way to do
this ...
.... it seems to me that since the two bars are two different sections
then I should use two divs.

So the questions I have:

1. Should I use two divs, one for each bar, and setting the line-
height in em instead of using the background image?
2. How to place side by side the logo and the banner and centered them
vertically?
3. I would like the Navigation and the Intro bars to have a minimum
height.

Thanks,
Miguel

In article
<faaa921b-db12-4e9a-8990-0053d8f9ce54 (AT) i76g2000hsf (DOT) googlegroups.com>,
shapper <mdmoura (AT) gmail (DOT) com> wrote:

So the questions I have:

1. Should I use two divs, one for each bar, and setting the line-
height in em instead of using the background image?

You might as well use two elements. Line height is mainly for text and
it is only sometimes a good idea to give it a unit.

2. How to place side by side the logo and the banner and centered them
vertically?

Placing inline things side by side is achieved by having them fit on one
line. That is their natural way. Otherwise, you can float elements. As
for centering, inline objects are centred by styling the container they
are in with 'text-align: center'. To centre a block element like a div,
specify a width and set the left and right margins to auto.

3. I would like the Navigation and the Intro bars to have a minimum
height.

If you mean this literally, then you can use min-height. If you mean it
more losely, just be sure to set small top margins and paddings and
minimum line heights to get the look you want.

--
dorayme

On Jul 30, 4:28*am, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:

In article
faaa921b-db12-4e9a-8990-0053d8f9c... (AT) i76g2000hsf (DOT) googlegroups.com>,

*shapper <mdmo... (AT) gmail (DOT) com> wrote:
So the questions I have:

1. Should I use two divs, one for each bar, and setting the line-
height in em instead of using the background image?

You might as well use two elements. Line height is mainly for text and
it is only sometimes a good idea to give it a unit.

2. How to place side by side the logo and the banner and centered them
vertically?

Placing inline things side by side is achieved by having them fit on one
line. That is their natural way. Otherwise, you can float elements. As
for centering, inline objects are centred by styling the container they
are in with 'text-align: center'. To centre a block element like a div,
specify a width and set the left and right margins to auto.

3. I would like the Navigation and the Intro bars to have a minimum
height.

If you mean this literally, then you can use min-height. If you mean it
more losely, just be sure to set small top margins and paddings and
minimum line heights to get the look you want.

--
dorayme

Thank You!