CSS Assistance

Discussion in 'HTML & Website Design' started by pcbro34, Aug 1, 2013.

  1. #1
    Hi

    Someone please help me. I need to add a hyper link on the image "banner1.png" to link to "http://www.website.com/download.php"" on my style.css document.


    #logo{ width:248px; height:70px; margin:0 0 0 20px;}
    #header{ position:relative; z-index:1; top:-20px; background:url(../images/banner1.png) no-repeat; height:297px;}
    #content{ margin-top:0px;}

    Thanks
     
    pcbro34, Aug 1, 2013 IP
  2. hello-universe

    hello-universe Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #2
    Try something like

    <div id="header"><a href="http://www.website.com/download.php"...> </a></div>

    then change your css to

    #header a { display: block; position:relative; z-index:1; top:-20px; background:url(../images/banner1.png) no-repeat; height:297px;}
     
    hello-universe, Aug 1, 2013 IP
  3. Phaaze

    Phaaze Member

    Messages:
    51
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    45
    #3
    Or just place the image in your HTML...
    <div id="header">
      <a href="http://www.website.com/download.php"><img src="images/banner1.png"/></a>
    </div>
    HTML:
    A CSS (Cascading Style Sheet) is for styling elements only, to add a link - you have to use HTML or JavaScript. hello-universe's solution will work by forcing the link to expand to the width of its container and thus creating a link over it. My way will embed the image as it's own element in the DOM and it'll be wrapped by the link. Both will work just fine if done properly.
     
    Phaaze, Aug 1, 2013 IP