Grow your CSS skills. Land your dream job.

Spread Classes Evenly Within Wrapper

  • # April 11, 2013 at 2:48 am

    [Your text to link here...](http://surfwithnicole.com/aboutus/press “Press Page”)

    I have .press-holder set to 105% to get the third container perfect with the edge of the main wrapper.

    The borders are temporary for the visual.

    When you squeeze the browser it causes a horizontal scroll.

    What’s the best way to space these apart without a right margin on the third container in the container?

    # April 11, 2013 at 4:21 am

    Here: http://codepen.io/Paulie-D/pen/gwait

    # April 11, 2013 at 5:36 pm

    Just what I was looking for, but what is causing the scroll bar?

    # April 11, 2013 at 9:32 pm

    I fixed the scroll bar because I used your #section1 properties. Problem now is It needs to work when I add more posts. If you look now the child is the 4th class.
    How do I disable right margin on the 3rd class on each row?

    # April 11, 2013 at 9:41 pm

    I think you are looking for this code. It applies 0px right margin to every third press holder and it’s offset by one to account for the various elements that are effecting it.

    .press-holder:nth-child(3n +1){
    margin-right:0px;

    # April 12, 2013 at 12:46 am

    That works nicely. This is perfect code for a dynamic grid populated with post types. Thanks again Paulie and thanks Cyanoxide!

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

You must be logged in to reply to this topic.

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