How to add image via CSS? (4 posts)

  1. kaswistry
    Posted 4 years ago #


    I tried everything already but my rusty coding just messes up the whole website design. In our business website at premiumseoservices.net (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

  2. stvwlf
    Posted 4 years ago #

    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"

  3. kaswistry
    Posted 4 years ago #

    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.

  4. stvwlf
    Posted 4 years ago #

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

Topic Closed

This topic has been closed to new replies.

About this Topic


No tags yet.