SitePoint Sponsor |
|
User Tag List
Results 1 to 15 of 15
-
Sep 25, 2004, 00:44 #1
- Join Date
- Feb 2004
- Location
- Switzerland
- Posts
- 2,253
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
line-height in pixels and font-size in percent.. correct?
Hi
Is that correct to have something like this?
Code:line-height: 17px; font-size: 75%;
thanks in advance
-
Sep 25, 2004, 05:39 #2
- Join Date
- Jul 2004
- Location
- Minneapolis, MN
- Posts
- 1,924
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I don't believe it will matter. I've done line height it pt (forgot what it stands for) and my font size in pixels.
-
Sep 25, 2004, 06:44 #3
If your font size is going to be set in percentages, set your line-height to a percentage as well for consistency. If a user bumps their text size up to something past 17px tall, your lines will run into each other.
-
Sep 25, 2004, 07:04 #4
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Yes as Vinnie says if the line-height is fixed in pixels and the font is percent then the font will grow but the line-height will stay the same and the font may grow out of the line.
If you use percent or ems for line-height then they stay proportional to each other as the text is resized.
If you have the font-size int the body set to 12px and your p tag set to 75% then that will be 9px high. So you can work out from there how much bigger 17px line height would need to be (about 1.9ems if my maths is correct)
Paul
-
Sep 25, 2004, 07:16 #5
Originally Posted by Paul O'B
-
Sep 25, 2004, 07:23 #6
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
lol - but I worked it out in my head not on a calculator
-
Sep 25, 2004, 07:29 #7
Originally Posted by Paul O'B
2/9 = .2222222222222
Ex-math major here
-
Sep 25, 2004, 08:25 #8
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Any number divided by 9 will just repeat itself
-
Sep 25, 2004, 09:14 #9
- Join Date
- May 2004
- Location
- Vancouver, BC
- Posts
- 32
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Paul: well it is equal to 1.00000... if u think about it
-
Sep 25, 2004, 09:38 #10
Originally Posted by Paul O'B
-
Sep 25, 2004, 10:25 #11
-
Sep 25, 2004, 10:29 #12
- Join Date
- Feb 2004
- Location
- Switzerland
- Posts
- 2,253
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
btw... can anyone tell what is the math for translating pixels into em?
now, what if I let the margin in px? Is that a problem (in terms of consitancy):
Code:body { background: #fff; color: #000; margin: 10px; line-height: 1.9em; font-size: 0.75em; font-family:Verdana, Arial, Helvetica, sans-serif; text-align: center;/* center for ie5*/ }
Code:<fieldset> <legend>Admin Login</legend> <form action="/admin/home.php" method="post"> <p> <label for="username">Username</label> <input type="text" name="username" title="input your username here" size="20" maxlength="30" /> </p> <p> <label for="password">Password</label> <input type="password" name="password" title="input your password here" size=20 maxlength="30" /> </p> <p></p> <p> <input type="submit" value="login" title="click this button to login in the admin control panel" /> </p> </form> </fieldset>
-
Sep 25, 2004, 10:44 #13
There's no real way to directly translate pixels to ems. Ems are based on the user's default text setting in their browser. Most browsers' default size is 14px unless the user decides to change it, but some browsers have 16px as the default. If you need to use pixels, then use pixels. Otherwise, if you have more flexibility in your layout use percentages or ems.
-
Sep 25, 2004, 10:49 #14
- Join Date
- Feb 2004
- Location
- Switzerland
- Posts
- 2,253
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
So using % or ems is quite the same is that it?
In this case I think I will feel more comfortable with ems...
what about the 'resizing text/forms' issue?
-
Sep 25, 2004, 11:35 #15
Originally Posted by duuudie
Originally Posted by duuudie
.
Bookmarks