Previous Message
Next Message

two background images in h1

Sent by Gunlaug_Sørtun on 20 March 2006 09:09

Brian Funk wrote:
> <>

> Can one put two background images in 1 header element?

Only one background image can go on each element

> On the following page I would like to have the h1's background image 
> to also show on the right side with the text sandwiched in between. 
> Is this possible?

Here is _one way_ to achieve that (based on existing styles)...

#headerwrap {
border-bottom: solid #E3C295 7px;
background: #000000 url(image/logo121x100.jpg) top right no-repeat;
padding: 0 100px 0 0;
min-height: 100px;

* html #headerwrap {height: 100px;}

h1 {
font-size: 300%;
text-align: center;
background: transparent url(image/logo121x100.jpg) no-repeat;
padding: 20px 0 10px 100px;
min-height: 70px;

* html h1 {height: 70px;}

....including compensations for IE's lack of support for 'min-height'.

> Also, can the text be lowered some to line up better with the image?

I've included a slight improvement in the styles above, by adding a
padding-top on h1. It'll always be a compromise though, since I didn't
want to change the source-code or the background image.

css-discuss [EMAIL-REMOVED]]
IE7b2 testing hub --
List wiki/FAQ --
Supported by --
Previous Message
Next Message

Message thread: