Floating images in the header

[mcktj]

Hi folks,

i have a problem with images in the header.

is it possilbe to float one image left then another right

here is my current code

Code: Select all

/*** header ***
we will hide text and replace it with a image
we need to assign a height for it
*/

div#header {
   height: 87px; /* adjust according your image size */ 
   background: #6699ff url(uploads/images/wardandboyd_ban_right.png) no-repeat;
       
}

div#header h1 a {
/* you can set your own image here */    
    
}

i want it to help with accessiblity when the screen is reduced to 800x600 resolution

Cheers in advance

Terry

[Dr.CSS]

You can float: them but you may find it won't mess the layout up so much if you use background-position: top left  or top right...

If the images are smaller than the box it moves them to the spot you tell it and lets the other show thru...

[mcktj]

Hi Guys,

Just if anyone esle has a question like this....

I created two new divs in the header div

Code: Select all

div#header {
   height: 104px; /* adjust according your image size */ 
   background: url(uploads/images/ward_bg.gif) repeat-x;
}

img.logoright
{
float:right;
}

img.logoleft
{
float:left;
}

the reason i needed it was to use the liquid layout properly
Cheers for your help Mark

Hope this helps others
Terry