0

I am trying to design new website but I have some problems. I am using 13inch laptop when I look at the site in my computers browser everything is fine but when I look at the bigger screen div's are shown smaller etc. Which units should I use for div's width, height and the margins ? I have already try px em and know I have made it something like this.

.tBackground{
        margin-left:10%;
        margin-top: -200px;
        margin-bottom:auto;
        margin-right:auto;
        height: 30%;
        width: 110%;
        background: rgba(80, 78, 78, 0.75);
        overflow:auto;

}

with this css it is normal at bigger screen but in my 13inch laptop it is very big it doesn't fit the screen

user3311299
  • 1
  • Maybe `%` but for each `width, height and margins (h/v)` it could be different and may cause trouble. – Hashem Qolami Feb 15 '14 at 15:41
  • 1
    Sorry, but there is no answer to this question. There is no "right" way. The problem you face is what each and every css author faces each and every day. – arkascha Feb 15 '14 at 15:41
  • This question is way, way too broad. You need to investigate responsive web design. It allows you to optimize designs based on screen resolution. – Mister Epic Feb 15 '14 at 15:41

1 Answers1

1

There's not simply one unit to be used in web design. The reason that they're all there is for variation. It entirely depends on what you want:

px - Does not scale down for mobile devices

em - Does scale down for mobile devices

percent - Takes up a set amount of the screen

It depends entirely on what is trying to be accomplished. However, these are just basic differences. If you would like to read more about them, you can visit this website (which also includes pt).

Also, you can read the answers to this StackOverflow question: Why em instead of px?

Community
  • 1
  • 1
Anonymous
  • 11,748
  • 6
  • 35
  • 57