@media only screen

sempriny / 2013-02-05 21:40:36   

Hi all

I'm a newby when it comes to responisve css. But I'd like my site to get a little narrower when the browser gets to the width of an iPad in portrait mode.

To achive this I've added this bit of code at the foot of my css file:

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
.exhibit { margin: 140px 0 0 330px;}

In practce this pretty much does what I want (if I could get this to work then I'd do more to make the experience richer).

But for now I just can't get the code to kick in when the browser gets to the desired widths.

Any ideas?

Thanks

Sam

sempriny / 2013-02-07 09:50:03   

For anyone interested this fixed it for me:

@media only screen and (max-width: 1100px) {
#exhibit { margin: 140px 0 0 230px;}
}

S

This thread has been closed, thank you.