Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Nov 2010
    Posts
    93
    Thanks
    23
    Thanked 0 Times in 0 Posts

    A Links not working when positioned

    Hi guys, I'm building my website and I tried positioning some links above my navigation bar, but when I moved them they no longer work.

    (The links themselves are currently set to w3schools just for testing)

    Live example - www.swiltch.com

    Any help appreciated.
    EDIT - It also makes the page unnecessarily big?


    HTML -

    Code:
    <div id="links"
    <a href="http://www.w3schools.com/" target="_blank">About Us</a>
    <a href="http://www.w3schools.com/" target="_blank">Contact</a>
    <a href="http://www.w3schools.com/" target="_blank">Site Map</a>
    </div>
    CSS -

    Code:
    #links {
    position: relative;
    top: 120px;
    right: -970px;	
    }
    Last edited by swiltch; 02-24-2011 at 08:08 PM.

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,667
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello swiltch,
    You should check that in the validator, you've probably just copy/pasted a couple times and missed something.
    Should be more like this maybe -
    Code:
    <div id="links"> 
    <a=href="http://www.w3schools.com/" target="_blank">About Us</a>
    <a href="http://www.w3schools.com/" target="_blank">Contact</a>
    <a href="http://www.w3schools.com/" target="_blank">Site Map</a>
    </div>
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #3
    New Coder
    Join Date
    Nov 2010
    Posts
    93
    Thanks
    23
    Thanked 0 Times in 0 Posts
    The text appears on the page like it should, but they are not clickable. The page is also a lot bigger than it needs to be.

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,667
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Quote Originally Posted by swiltch View Post
    The text appears on the page like it should, but they are not clickable. The page is also a lot bigger than it needs to be.
    Yes, I saw the links were broke. That's why I pointed out the broken #links.

    You page is very wide because of that huge negative margin.

    For positioning to work reliably, you should not be using so much relative. One containing element that is relative and the other positioned elements absolutely positioned is much more predictable.

    Do you really need all that positioning though?
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #5
    New Coder
    Join Date
    Nov 2010
    Posts
    93
    Thanks
    23
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Excavator View Post
    Yes, I saw the links were broke. That's why I pointed out the broken #links.

    You page is very wide because of that huge negative margin.

    For positioning to work reliably, you should not be using so much relative. One containing element that is relative and the other positioned elements absolutely positioned is much more predictable.

    Do you really need all that positioning though?
    Thankyou excavtor, i'll have a play round with the positioning and see if I can make them work in that area.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •