Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] How to middle align small text next to large text?

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #165961
    magician11
    Participant

    Here is the code I’m looking at..
    http://jsfiddle.net/magician11/sGtcE/

    I’m wondering how to best get the heading on the right of the number middle aligned next to that large text number?

    Thanks.

    #165962
    MikeMedia
    Participant

    Have you tryed doing this?

    <div class="holder"><span>#1</span> <span>Personal Coaching</span></div>   
    

    CSS:

    .large_numbering {
    
    font-size: 60px;
      font-weight: bold;
      vertical-align: middle;
    }
    
    .some_heading {
      color: #ff9b00;
      font-size: 22px;
      margin-left: 20px;
    }
    
    .holder{
         height: 50px;
         line-height: 50px;
    }
    
    #165963
    Paulie_D
    Member

    It will actually depend on what the overall design is supposed to be but

    display:inline-block and vertical-align:middle will get it done.

    http://jsfiddle.net/sGtcE/2/

    #165966
    magician11
    Participant

    Thanks Paulie_D. That worked great.

    I actually did that to the “some_heading” class, but didn’t realise I had to apply it to the “large_numbering” class too.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.