Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    AAS
    AAS is offline
    New to the CF scene
    Join Date
    Nov 2011
    Posts
    1
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Help with Text Baseline

    solved
    Last edited by AAS; 11-03-2011 at 04:06 AM.

  • #2
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts
    vertical-align only works for inline elements.
    in fact vertical-align is not what you think it is

    Code:
    <div style="position: relative; width: 300px; height: 300px; border: 1px solid;">
        <div style="position: absolute; bottom: 0; width: 100%; height: 10px; background-color: #DDD;">
              
        </div>
    </div>
    By setting the parent to position: relative;, everything you absolute within it will be relative to the parent. Therefore it will be at the bottom (relatively)

    You can also you display: inline-block; or display: table; w/ display: table-cell for children to use vertical-align: ; in the way you want to use it, though both have browser support issues (more for display: table)

    vertical align alone will be relative to the tallest element within the parent, not really what your looking for in this case
    Last edited by Sammy12; 11-03-2011 at 02:10 AM.

  • Users who have thanked Sammy12 for this post:

    AAS (11-03-2011)


  •  

    Posting Permissions

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