Grow your CSS skills. Land your dream job.

Getting label and select onto the same line

  • # November 13, 2013 at 2:10 pm

    I’m struggling with getting my label and select onto the same line on this page:

    http://rsatestamls.kaliocommerce.com/hand-tools/c/10200000/

    For the sort by / best sellers / view all pagination stuff.

    ._. Any ideas on how to do this?

    Thank you bunches.

    # November 13, 2013 at 2:16 pm

    try:

    #sorting label{
     display : inline;
     padding-right : 4px;
    }
    
    #sorting select{
     margin-top : 4px;
    }
    
    Ed
    # November 13, 2013 at 6:00 pm
    #sorting label {
        display: inline-block;
    }
    

    I would also suggest adding some top padding on the parent.

    # November 14, 2013 at 7:27 am

    Awesome – that seemed to work.

    I hate to ask a follow up -But, I’d like to position the pagination (1, 2, 3, view all) on the right-hand side of the grid-control element.

    What would I do for that?

    Thank you.

    Ed
    # November 14, 2013 at 4:37 pm

    I would suggest you add .offset4 as a class to that element as that would normally offset the element so it appears to be on the far right, but that doesn’t work because your version of Bootstrap seems to be weird and isn’t using very good media queries. Have you edited it?

    I’m not really sure what to suggest. Bootstrap’s class names don’t seem to work. You’ve got 2 elements that both span 4 columns each, so it should be possible for you to add .offset4 to the second one and have it appear to be on the far right (there’s a max number of 12 columns), but that doesn’t seem to be working.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".