SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast thehung1724's Avatar
    Join Date
    Sep 2013
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Is it good to use both em and px in your design?

    As @felgall said:

    You should use one or the other for the text on your page and not try to mix them or your page will break.

    em is intended for defining text size.

    px is intended for defining border widths and image sizes.
    Now i use em for text size and px for others. But i still confusing when using both em and px in my design. Example

    Code:
    p{
        font-size: 0.8em;
        padding-bottom: 15px;
    }
    Is above code ok? Hope everyone give me advice. Thank in advance.

  2. #2
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,507
    Mentioned
    61 Post(s)
    Tagged
    2 Thread(s)
    Yes, the above code is OK.

    Choose ems when you want the size or space to change in concert with the user's font size preference.

    Use px where you do not want the space to change if the user uses a different font size.

  3. #3
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,809
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    The effect of that code is that the distance below paragraphs before the next element starts will not vary with the font size.

    If someone enlarges the font significantly the page will eventually end up with gaps between the paragraphs that are smaller than the gaps between the lines within a paragraph. You'd have to make the font size rather large before that happened though.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  4. #4
    SitePoint Enthusiast thehung1724's Avatar
    Join Date
    Sep 2013
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ronpat View Post
    Yes, the above code is OK.

    Choose ems when you want the size or space to change in concert with the user's font size preference.

    Use px where you do not want the space to change if the user uses a different font size.
    thank you so much.

  5. #5
    SitePoint Enthusiast thehung1724's Avatar
    Join Date
    Sep 2013
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    The effect of that code is that the distance below paragraphs before the next element starts will not vary with the font size.

    If someone enlarges the font significantly the page will eventually end up with gaps between the paragraphs that are smaller than the gaps between the lines within a paragraph. You'd have to make the font size rather large before that happened though.
    Does your mean is line-height?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •