How to get full width in body element

Question

How would I be able to get a website to auto-fit in the page  It s a landscape design which needs no scrolling

User · Answer

You should set body and html to position fixed   and then set right   left   top   and bottom  to 0   That way  even if content overflows it will not extend past the limits of the viewport   For example    lt html gt   lt body gt       lt div id  wrapper  gt  lt  div gt   lt  body gt   lt  html gt    CSS   html  body        position fixed      top 0      bottom 0      left 0      right 0      JS Fiddle Example  Caveat  Using this method  if the user makes their window smaller  content will be cut off

User · Answer

If its in a landscape then you will be needing more width and less height  That s just what all websites have   Lets go with a basic first then the rest   The basic CSS   By CSS you can do this    body   width  100   height  100       Here you are using a div with id body  as    lt body gt     lt div id  body gt      all the text would go here     lt  div gt   lt  body gt    Then you can have a web page with 100  height and width   What if he tries to resize the window   The issues pops up  what if he tries to resize the window  Then all the elements inside  body would try to mess up the UI  For that you can write this     body   height  100   width  100       And just add min-height max-height min-width and max-width   This way  the page element would stay at the place they were at the page load   Using JavaScript   Using JavaScript  you can control the UI  use jQuery as        body   css  min-height    100       And all other remaining CSS properties  and JS will take care of the User Interface when the user is trying to resize the window    How to not add scroll to the web page   If you are not trying to add a scroll  then you can use this JS      body   css  min-height   screen height      or anyother like window height   This way  the document will get a new height whenever the user would load the page   Second option is better  because when users would have different screen resolutions they would want a CSS or Style sheet created for their own screen  Not for others   Tip  So try using JS to find current Screen size and edit the page

User · Answer

You can use CSS to do it for example  lt style gt  html      width 100       height 100     body      width 100       height 100       background-color  DDD     lt  style gt

[html] How to get full width in body element

Examples related to html

Examples related to css

Examples related to web

Examples related to responsive-design

Examples related to resize