#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2012
    Posts
    2
    Rep Power
    0

    Resize window, scale down menu css


    Hello,

    The menu layout I currently have for the wider 'desktop' view is fine. I would like to replicate this layout in the 'ipad' screen size but instead have the logo sitting about the menu items. Can anyone help me in correcting this?
    The website is: hypoly.com

    Thank you,
    Chiny
  2. #2
  3. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2012
    Posts
    119
    Rep Power
    32
    In your css for media queries the div that holds your logo and navigation are not floated but positioned central to the page:
    Code:
    .header-left {
    		float: none;
    		margin: 0 auto;
    	}
    .header-right {
    		margin-top: 20px;
    		width:100%;
    	}
    This is what you need to change to match the main css (maybe adjust the widths slightly if necessary):
    Code:
    .header-left {
        width: 250px;
        float: left;
    }
    .header-right {
        position: relative;
        float: right;
    }
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Dec 2012
    Posts
    2
    Rep Power
    0
    @simplypixie

    Thank you very much, problem solved

IMN logo majestic logo threadwatch logo seochat tools logo