CODEWITHSUNDEEP
css
user2003663
user2003663

Reputation: 45

clickable logo link in header

I want to add my clickable company logo to the header, which will redirect them to homepage. I tried this, but it makes the whole header clickable.

<div id="header">
    <a style="display:block" href="profile.php" >
        <label>
            <img src="images/logo.png" height="50x" width="180px" />
        </label>
    </a>
</div>

I have added the CSS associated with it:

div#header a
{
 position:fixed;
 height:40px;margin:0;width:100%;
 padding-left:30px;background: #00BFFF
 }

Upvotes: 0

Views: 3550

Answers (3)

lax
lax

Reputation: 76

try this

 </style> 
 div#header 
         {
         position:fixed;
        height:40px;margin:0;width:100%;
        padding-left:30px;background: #00BFFF
       }
</style> 


<div id="header">
      <a s href="profile.php" >  <img src="slider-button-left.png" height="50x" width="180px" /></a>
</div>

Upvotes: 0

Dipesh Parmar
Dipesh Parmar

Reputation: 27364

Use CSS.

Don't use INLINE CSS STYLE. Instead create css file and paste code and include it in page.

<style type="text/css">

    div.header
    {
        display: block;
        height: 40px;
        position: absolute;
        width: 100%;
    }
    div#header a img
    {
        cursor:pointer;
    }
    .header .logo
    {
        display: block;
        float: left;
        padding: 4px 3px;
    }
    img
    {
        border: 0 none;
        height: auto;
        max-width: 100%;
        vertical-align: middle;
    }
</style>

<div class="header">
    <a href="action.php" class="logo">
        <img title="Title" alt="Alter" src="img/4.png">
    </a>
</div>

Upvotes: 2

Roopendra
Roopendra

Reputation: 7762

Please remove display: block from anchor :-

<div id="header">
    <a href="profile.php" ><label><img src="images/logo.png" height="50x" width="180px" /></label></a>
</div>

Upvotes: 0

Related Questions