wordpress - CSS small screen issue -
my query wordpress site womensfertility n hormones. c o m if view site on smaller screen resolution 1024 x 768 site this:
but if view on normal computer screen big resolution looks good, if scale iphone , ipad scale normal responsive. i'm using optimizepress. i've added code make site boxed layout , have background image instead of full width. code i've added was:
.banner .logo img{width:200px} .banner.centered-banner > .fixed-width .banner-logo { width: 100%; } .container { margin: auto; overflow: hidden; padding: 0; position: relative; width: 75%; }
i guess width: 75%;
, .banner .logo img { width: 200px; }
makes site looks way, have no idea how make site boxed without doing code. idea?
@media (max-width: 600px) { /*code screen max 600px*/ } @media (max-width: 480px) { /*code screen max 480px*/ }
or:
body { color: white; background: gray; font-size: .5in } @media screen , (min-width: 1024px){ body { background: red; } } @media screen , (min-width: 641px) , (max-width: 1023px){ body { background: yellow; } } @media screen , (max-width: 640px){ body { background: green; } }
for example :
@media (max-width: 480px) { .banner .logo img{width:140px} .banner.centered-banner > .fixed-width .banner-logo { width: 80%; } .container { width: 35%; } }
Comments
Post a Comment