CODEWITHSUNDEEP
iphonecssresponsive-design
user1991171
user1991171

Reputation: 23

css 100% width iphone

I am having a rough time with responsive design on this one site. Don't know what is happening, and my code has kind of turned to crap as a result, this is a modified zurb foundation grid, however the client wanted left navigation. Once the design drops to an iphone for some reason the width of the top elements (logo, menu) has some margin, padding or is only approx 80% width. See http://eseamedia.com/lm 

@media only screen and (max-width: 767px) { 

.menu {
    background: none;
    padding: 0;
    margin: 0;
    height: auto;
    max-width: 100%;
    min-width: 100%;
    position: relative;
    display: table;
    float: none; }

.menu nav {
    height: auto;
    margin :0 auto 26px auto;
    width: 100% }

.menu ul li a {
    margin: 0 auto;
    width: 100%;
    display: block;
    text-align:center; }

.logo {
    background-position: center center;
    background-color: transparent;
    margin 0;
    height: 104px;
    width: 321px;
    padding: 0 }

.info {
    position:relative }

.headline{
    margin:0;
    position:relative;
    padding:0;}

.context, .wrap {
    margin:0;
    left:0;}
}

Upvotes: 0

Views: 3975

Answers (1)

Sark
Sark

Reputation: 4546

use meta tag 

<meta name="viewport" content="width=device-width, maximum-scale=1.0" />

Upvotes: 5

Related Questions