height in css

[Lenny_la9]

Hi,

I'm trying to display a thin bar (5px in height) with a background image.
The bar div layer seems to be ignoring the height attribute I set in the css
file and drawing the layer at about 20 pixels, making the graphic tile
vertically.

The problem page is located at: http://www.bwgarage.co.uk/css_test

Can anyone offer any help?

Thanks.

 

[Richard]

Hi,

I'm trying to display a thin bar (5px in height) with a background
image.
The bar div layer seems to be ignoring the height attribute I set in
the css
file and drawing the layer at about 20 pixels, making the graphic tile
vertically.

The problem page is located at: http://www.bwgarage.co.uk/css_test

Can anyone offer any help?

Thanks.

If the coding is being ignored, check your syntax. It could be as simple as
: and ; and }.
Is the image 5 or 4 pixels high? Could make a big difference.
But why use an image within it? Why not make the entire line an image? Then
all you need to do is place the image.

 

[informant]

If the coding is being ignored, check your syntax. It could be as simple as
: and ; and }.
Is the image 5 or 4 pixels high? Could make a big difference.
But why use an image within it? Why not make the entire line an image? Then
all you need to do is place the image.

Did you actually look at the page in question, Mr. Bullis?

 

[Brett]

Use background-repeat: repeat-x; inside your #bar in your new.css file. Like
the following:

#bar
{
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 5px;
margin: 0px;
padding: 0px;
background-image: url(bar.jpg);
background-repeat: repeat-x;
z-index: 1;
}

 

[Richard]

Use background-repeat: repeat-x; inside your #bar in your new.css
file. Like
the following:

#bar
{
position: absolute; top:: 0px;
left: 0px;
width: 100%;
height: 5px;
margin: 0px;
padding: 0px;
background-image: url(bar.jpg);
background-repeat: repeat-x;
z-index: 1;
}

Got to ask, why a z-index with a minor image?

 

[Lenny_la9]

Thank you,this works fine.

I'm using z-order because this will go up to make a more complicated page in
the end.

Thanks