I'm trying to get my website to use RWD for small screen devices. I have a section in my css thus -
@media only screen and (max-device-width: 480px) {
blah, blah, blah
}
which resizes the main div from 768px to 400px.
Other internal divs move around accordingly and it all seems to work in terms of content re-arranging.
However on the display the emulator I'm using (Eclipse AVD) shows the page as narrower than before with the text still the same size. I sort of expected the page to fill the display and thus text be larger and readable.
Somehow I need to resize the content or change the resolution of the emulator to be say 480px so that the new 400px wide page displays large enough to be read.
I know I'm missing something here but I'm not sure what?
Any help greatly appreciated.
John
PS The AVD emaulator is mimicking a Galaxy Nexus 720x1280 xhdpi if that helps.