4 replies
  • WEB DESIGN
  • |
Hey everyone,

Have a quick question on my website widths.

At the moment when you go onto the website on a laptop it is going off the page. How do I get the website to automatically adjust to fit everyone's screens?

Thanks :-)
Katy
#website #widths
  • Profile picture of the author blackli0n
    The function you need is called LIQUID WIDTH (which adjusts down to the pixel according to the browsers width). Another option would be RESPONSIVE TEMPLATE (which changes width depending on the type of device used: desktop/laptop/tablet/mobile).
    Signature
    wpjohnny.com - Make Money with Wordpress
    Passive income since 2007. Trying to consistently crack 5-figures/month. find what you love - dream big - work hard
    {{ DiscussionBoard.errors[8618596].message }}
  • Profile picture of the author clickbump
    Originally Posted by katy1987 View Post

    At the moment when you go onto the website on a laptop it is going off the page. How do I get the website to automatically adjust to fit everyone's screens?
    As a starting point, you need to convert any fixed "width:X" attributes in your CSS to "max-width:X".

    That's the starting point for making a website "Responsive". Rather than defining that objects are a fixed width, you are setting a maximum width for the element relative to its parent container.

    There's much more that can be done to make it fully responsive, including the addition of CSS media queries to customize the layout based on the browser width.
    Signature
    {{ DiscussionBoard.errors[8624510].message }}
    • Profile picture of the author 546961
      What system are you building your website with? Is it hard coded? Are you using Wordpress? If so, what theme?

      What you are looking for is termed "responsive design". It is pretty much impossible to make element by element changes on top of a non-responsive code base and wind up with a responsive site.

      If you are using Wordpress you need to find a better theme. If you are hardcoding you should start off with a responsive framework. Twitter Bootstrap is very popular, I also like the semantic grid.

      You can break a responsive framework by hardcoding nested element widths in pixels. All widths should be percentage based and in many cases further limited by max-width and min-width values.
      {{ DiscussionBoard.errors[8636038].message }}
  • Profile picture of the author katy1987
    Hi,

    Thanks for all of the replies,

    Im using Studiopress - Corporate Theme and I am using wordpress. Really sorry its taken so long to reply back but I do really appreciate all of the help.

    Thanks,

    Katy
    {{ DiscussionBoard.errors[8883701].message }}

Trending Topics