Trying to make a fixed page size using HTML and CSS

Question

I want the width of my web page to be the certain size. So that it would automatically change to full screen on mobile devices.Here is the ideal example of the page layout, I am trying to make: http://sidebar.io/new. For now I have ordinary html and css files, and they display an ordinary desktop page. I was trying to change the width of the body element to 600px, but that is not it, I was trying the method that is described here: height and width on html and body elements, but that is also different from what I want. I want my web site, to have the layout exactly as in the first link. Can anyone please at least give me a clue on how to do that?

Here's some code, of what I've tried.

body {
    width: 200px;
     position: fixed;
     top:auto;
     bottom:0px;
     right:0px;
     left:auto;
}

another one:

body {
    width: 600px;
    overflow-y:scroll;
    border: 1px solid black;
}

#childOfTheBody{
    height:100%;
    background-color: #a2e89f;
}

#childOfTheChild{
    height: 500px
}

Can you post some code of something you have tried? – codyogden May 09 '15 at 05:23 — codyogden, May 09 '15 at 05:23

score 0 · Answer 1 · edited Dec 18 '18 at 09:29

0

Instead of giving the size in pixel give in percentage.

Eg : instead of width: 600px give width : 50%

edited Dec 18 '18 at 09:29

Farhana Naaz Ansari

7,524
26
65
105

answered May 09 '15 at 05:27

Mani Kandan

699
1
10
30

Trying to make a fixed page size using HTML and CSS

1 Answers1