tags:

views:

43

answers:

2

Hey everyone,

I'm trying to position the following items but can't quite get it right.

Her is the desired outcome:

|Blah Bah (img)                           Link|

The image is aligned to the right of the H3 on the left and the link is positioned to the far right. All is on the same line.

    <div style="float:left;"><h3>Blah Bah</h3></div>
      <a href="#"><img src="image\edit.png" /></a>
    <div style="float:right;">Link</div>

<html>
<style>
    h3
    {
        color: #0066CC;
        font-size: 130%;
        font-weight: bolder;
        padding-top: 0px;
        margin: 0px;
    }
</style>
<body>
    <div style="float: left;"><h3>Blah Bah</h3></div>
    &nbsp;<a href="#" style="padding-top: 25px;"><img src="go.gif" style="padding-top: 2px;" /></a>
    <div style="float: right;">Link</div>
</body>
</html>
A: 

Default a h3 tag has margin-top and margin-bottom, that's why your elements are not on the same row.

You can change that by adding the following style:

h3 {
   margin: 0;
}

But better is to use a reset style sheet so you know all elements are reset. http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/

Skelton
That was the ticket. I will post what i messed with while you posted this answer.
chopps
A: 

I'll be honest with you, I've read it a handul of times, and I still can't decipher this sentence, so I have no idea what you want:

The image is aligned to the right of the H3 on the left and the link is positioned to the far right. All is on the same line.

I recommend uploading a Photoshop image to demonstrate what you want the final outcome to be.

Meanwhile, here's my crack at it:

alt text

JohnB