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 3 of 3
  1. #1
    Banned
    Join Date
    Mar 2007
    Posts
    1,523
    Thanks
    116
    Thanked 0 Times in 0 Posts

    Question responsive layout links not working (mobile view)

    hi, on my website: here I am using getskeleton framework. when i go to the URL on my phone or resize my browser to 340px wide, I am then unable to click on many of the menu links?!

    Please help?

    thanks

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello again jarv,
    I can't click on your links at all. I'm looking at the site with FF19. One of your .container's is laid over top of your .topnav

    Add this background color to see what's happening -
    Code:
    .container {
        background: #f00;
        margin: 0 auto;
        padding: 0;
        position: relative;
        width: 960px;
    }
    To make that .topnav come to the top so a .container doesn't cover your links, use some z-index to change the stacking order.
    Try this -
    Code:
    .topnav {
        height: 60px;
        position: relative;
        z-index: 1;
    }
    See z-index here.


    .
    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
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,303
    Thanks
    23
    Thanked 612 Times in 611 Posts
    Are you sure your talking menu links?
    The code I see does not take you anywhere in the menu links:
    Code:
    <ul>
    	<li><a href="#" title="Home">Home</a></li>
    	<li><a href="#" title="About">About</a></li>
    	<li><a class="selected" href="#" title="The Lots">The Lots</a></li>
    	<li><a href="#" title="The Authors">The Authors</a></li>
    	<li><a href="#" title="Contact Us">Contact Us</a></li>
    </ul>
    The images work to display larger images. IMHO, they should be centered in the page and not attached to the cursor, because they sink below the view port on lower images.

    Funny this, I did not link to the css files and got the 221B blog logo at the top.
    Last edited by sunfighter; 02-18-2013 at 07:18 PM.


  •  

    Posting Permissions

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