Search code examples
htmlcsscss-positionabsolute

How can I position the link to the top right area? (Absolute positioning with a header as a relative)


I'm trying to get the Anime Link to the top right area but can't. Only managed to do it like this but its maximum position is until the bottom of the other header. I'm an absolute newbie in this. What I managed to do

enter image description here

#Header {
        position:fixed;
        background-color:#FFFFFF;
        width: 100%;
        height: 8%;
        top:0px;
    }
    #Header h1{
        margin-top:0px;
        position: relative;
    }
    #Header a{
        color:rgb(255,0,0);
    }
    #Header h3{
        position:absolute;
        top: 0px;
        right: 0px
        margin-top:0px;
    }
<div id=Header>
<h1>
imsmoothlikebutter
</h1>
<h3>
<a href= "anime" Target="Blank"> Anime</a>
</h3>   
</div>


Solution

  • I think you forgot a semi-colon on line 18.

    #Header {
            position:fixed;
            background-color:#FFFFFF;
            width: 100%;
            height: 8%;
            top:0px;
        }
        #Header h1{
            margin-top:0px;
            position: relative;
        }
        #Header a{
            color:rgb(255,0,0);
        }
        #Header h3{
            position:absolute;
            top: 0px;
            right: 0px; /* You forgot a semi-colon on this line */
            margin-top:0px;
        }
    <div id=Header>
    <h1>
    imsmoothlikebutter
    </h1>
    <h3>
    <a href= "anime" Target="Blank"> Anime</a>
    </h3>   
    </div>