Typography and other stuff

HTML & CSS
1

Hi, my first post, I’m going to begin a web project very small one, and I would ask to you somethings about the line-height and font-size css rules.
So I read a lot of info but I’m still in confusion about it.

I have enough work on my back to understand how the css works but what about the text I’m still a beginner :slight_smile:

My question is:
What is the relationship between the resolution and line-height?
If I use a wrapper width 1024 px, what is the best line-height?
Thanks a lot.

2
  1. Depends on hyow you set it.Line height is just related upon the font size. So the font size must be % to even have a change depending on resolution.
  2. Personal preference upon how it looks. I personally like the default.
3

Line height is the space between one line and another and you would set it to whatever suits your design the best but generally 1.5 times the font-size would give the text room to breathe. (1 x font-size would be to close and lines would almost run into each other.)

Not really sure what you are asking as there is no real correlation between line-height and the resolution you use. Changing the resolution changes the way the whole page fits on the screen and affects everything in the same manner. Although I guess you didn’t really mean resolution but perhaps width or something similar.

If I use a wrapper width 1024 px, what is the best line-height?
Thanks a lot.

It depends on the size of the text. The wrapper size doesn’t make much difference except that at large widths perhaps you wouldn’t want the lines too close together as they would be hard to read. Longer lines are hard to read if they are close together so its best not to have lines that are too long or are too close together.

You can find more specific details here:

http://www.maxdesign.com.au/articles/em/

Generally I set a line-height on the body of about 1.4 or 1.5 which gives breathing space to the text for most uses.

4

Thanks so much for your answers, the question of the height line I posted was about the purely aesthetic funcion, to find harmony between the site layout and textual content.
I was reading some articles about the Golden Ratio and Modular scales:

I was wondering what the actual benefits of these solutions can make your web project more attractive.
For this reason I tried to find more information about relationship between, for example, the wrapper and the line height.
My English is not so advanced to understand everything I read on the net and to explane my concept too!
Sorry for that.

Thanks for those useful links :slight_smile: