The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS how do make a page that is responsive & always fill the page width ways and height

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #40797

    Hi everybody

    I am currently building an android app using phonegap using HTML5 and CSS3.

    The client wants the app to fit always within the screen, be responsive and have no scrolling.

    Thankfully it must only be in portrait.

    I’m having problems building it so it always fits within the screen on all different media, from 320 px wide smartphones to tablets at 1280 pixels wide.

    I have tried approaching this using just percentages, but find fonts dont grow or get bigger with the natural changing size of the page as the divs do. Also I’m finding it hard to size a div in percentages within a div that is sized with percentages.

    Any ideas or thoughts much appreciated…



    No scrolling…but what if the content is taller than the viewport height?

    It sounds that though you need to start with a sticky footer technique (even if there is nothing in the footer) but that’s not going to help with the scrolling issue.

    If you solve that problem then media queries will probably solve the rest.


    Hi Paulie

    Well, the person who designed, designed it to fit a 320px wide screen. This is fine, I made it fit that perfectly but then when I started building the media queries up, it fell to pieces because of the difference between width vs height…

    I’ll look at sticky footer, thanks


    Without seeing it in action it’s tough to help.

    If you could put the relevant parts in Codepen we might make a start.


    Of course I appreciate that.

    I’ve just got to finish another project today but will post on here friday ok?



Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.