Support » Themes and Templates » How to add image via CSS?

  • Hello!

    I tried everything already but my rusty coding just messes up the whole website design. In our business website at (note that I have deliberately not linked to the website to avoid being accused of spammin and link building), I’d like to add a small image at the top, preferrably above the current navigation, that has our hotline number in it. Ive tried abslute, relative, top, bottom, div, it just messes everything up.

    Any ideas how I can add an image to the top?

    Thanks alot

Viewing 3 replies - 1 through 3 (of 3 total)
  • I tend to make them background images of DIV’s or A tags if they need to be links.

    On your site, add this to css
    #headerwrap { position: relative; }
    that is needed to make the absolute positioning on the image be in relation to headerwrap rather than the body tag.

    In your header.php, after the headerwrap div, create a div
    <div id="phone"></div>

    then in css

    #phone {
       position: absolute;
       background: url(path/to/image/phonenumber.jpg) no-repeat;
       height: 99px;  /*  height of the phone image */
       width: 199px;   /*  width of the phone image */
       left: 0px;
       top: 0px;

    now you adjust left and top until you have the phone # image situated where you want it. You can use negative pixels if you need to. You can also use percentages, positive and negative. Because headerwrap is 100% width it may be a little tricky. Its trial and error.

    If that won’t work try this:
    #header { height: 100%; position: relative; }
    and in the header.php file put #phone inside div “header” instead of inside div “headerwrap”

    Thanks for the help but it wasn’t fixed 🙁

    The first code was the closest I got but apparently, only the top 0 works. if you add a value, the image goes down.

    Also, the left or right values, even if changed, do not make any changes to the image’s position.

    Any ideas?

    Thanks sir.

    I would really have to see this live on your site to determine what is going on.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to add image via CSS?’ is closed to new replies.