Text position in banner

[daddyalfie]

I'm embarrassed to even post this, because it should be so darn simple. I'm scratching a bald spot on my scalp!

 

Have a look http://www.plainvanillagraphics.com/Kats/index.html

 

I (obviously!) want the text "Kat's Family Hair Care" to appear up in the banner next to the logo. I have "floated" and "cleared" made new div's but it just sits down there like a dog turd!

 

Help?

 

Alfie

[PicnicTutorials]

Floats and all that stuff are tricky sometimes. I cleaned up the html (only in the banner area), got rid of the corresponding css, and added some css. Works in all...

 

 

 

 

 

Kat's Family Hair Care

 

Some text here. vmwo9ovj ms.kfe qmvoe

• &nbsp
• Year 2008

• Year 2009

 

 

 

Web Design:   Alfie's Plain

Vanilla Graphics & Web Design

 

© - 2008 Richard Linquist -- All rights reserved.

 

 

Edited January 16, 2009 by Eric

[daddyalfie]

Fantastic fix Eric. Many thanks!

 

But, can you or anyone explain why that works?

 

I fixed the thing myself by using negative margins and relative positioning and stuff, but that seems so darn awkward!

 

see http://www.plainvanillagraphics.com/Kats1/index.html

 

See what I mean?

 

Alfie

[PicnicTutorials]

Sure, the float (h1) needs to be above the img in the html. vertical-align: bottom was for ie6 otherwise it has a small space below the image. This is because an image is an inline element and therfore, by default, it's allowing room for things such as the tail of a "p". You can also fix that by giving the image display block, or the banner overflow hidden, or font-size 0.

 

There are many ways to do what you wanted. Just use whatever you understand better.

[daddyalfie]

Your'e Da Man!

 

Thanks

 

Alfie