Responsive 4 – 2 – 1 like Outreach Pro

Community Forums Forums Design Tips and Tricks Responsive 4 – 2 – 1 like Outreach Pro

This topic is: not resolved

This topic contains 1 reply, has 2 voices, and was last updated by  Susan 5 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #84693

    Peter.Ingersoll
    Participant
    Post count: 12

    Hello,

    I’m trying to replicate the responsive technique used in Outreach Pro.

    There are four widgets in a widget-area / sidebar Home-Bottom (in Outreach Pro). The widgets display four wide. As the window reduces, the widgets go two wide / two tall, then one wide / four tall.

    I see CSS that’s is part of the technique.

    .home-bottom .widget {
    	float: left;
    	margin-left: 2.564102564102564%;
    	width: 23.076923076923077%;
    }
    
    .home-bottom .widget:nth-child(4n+1) {
    	clear: both;
    	margin-left: 0;
    }

    I don’t know if anything else is involved. I’d really like to make this work. I’m currently using column classes. I can only go four wide to one wide.
    http://cornellscottproud.org

    I’m using Genesis Featured Widget Amplified. I also changed the name of the widget area to the one I’m using in my Dynamik Genesis child theme.

    Suggestions please?

    - Peter

    http://cornellscottproud.org
    #91777

    Susan
    Moderator
    Post count: 7985

    As you posted this a while back, I hope you were able to get it resolved. If not, please report back, and I will escalate for you.

    Thanks!


    Susan @ Graphically Designing I’d love to customize your website! I tweet!
    I’ve taken up the challenge! – help me answer some of the unanswered posts

    • This reply was modified 5 months ago by  Susan.
    • This reply was modified 5 months ago by  Susan.
Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.