SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    Sep 2009
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How do you Style Number Suffix

    I'm working with a list that uses php to display a date for which the item in the list was added. I have the date displayed using php as follows
    Display the Day number and suffix with the suffix nested within the day div:
    Code:
    <div class="day"><?php time('d'); ?><div class="suff"><?php time('S'); ?></div></div>
    I need the suffix to hang next to the day number and float as the number is grows from single digit to double.
    Here is the css I'm using but it's just not working.
    Code:
    .day {
        position:relative;
        margin: 8px auto 0 auto;
        overflow: hidden;
        font-size: 18px;
        line-height: 75%;
        letter-spacing: 2px;
        text-align: left;
        width: 45px;
        min-width: 35px;
        /*background-color: white;*/
        /*color: #000;
        text-shadow: 1px 1px 2px #ccffcc;*/border:1px solid red;
    }
    .suff {
        position:relative;
        font-size: 13px;
        line-height: 65%;
        text-align: left;
        text-decoration: underline;
        border: 1px solid red;
        float:right;
    }
    Thanks for any help

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,585
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Hi, you display the first part of the date without any sort of parent wrapping around it. Wrap the
    <?php time('d'); ?>

    In a <p> or something (some sort of element)and then float that left

    Floats must come first in the HTML.
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  3. #3
    SitePoint Zealot
    Join Date
    Sep 2009
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by RyanReese View Post
    In a <p> or something (some sort of element)and then float that left

    Floats must come first in the HTML.
    Works Great!
    Thank you

  4. #4
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,585
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Glad it helped . You're welcome.
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work


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
  •