Jump to content

Align Image with Title Text

Recommended Posts

Linked is my website that I have been working on and off for awhile.

As you can see the image is not inline with the title, I realise this is probably a jquery issue that I am just not getting.


Can anyone advise me on the correct tag or class I should be applying to have it inline with the title.


Thank you



Link to post
Share on other sites

The image (I assume you're referring to the shield on the top left corner) has an absolute position. Because of that, it's going to the exact pixel position on the page that you told it to.


You can try changing the top and left properties to move it around to a better position, or you can remove the absolute positioning and use other techniques.


The <br> tag in your source code is causing there to be space above your <h1> element, you would have a lot more control over that if you removed it and gave a top margin to the <h1> instead.

Link to post
Share on other sites

Thanks, I didnt want to use the <br> either but I just don't know enough to think of something better, but now I do haha thanks.

Margins are my savior

<div data-role="header" data-id="header" data-position="fixed"><img src="img/logo.gif" alt="logo" class="ui-btn-left" style="width:2.5em; margin-top:.3cm; margin-left:.3cm;"><h1 id="title" style="margin-top: .3cm;" ></h1></div>
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...