Parallax Pro – Horizontal Alignment of Text Widgets

[mspam]

Instead of the pricing table in Home Section 4, I'd like to feature my services (like the Front Page 3 widget area of the Digital Pro theme). How do I change the alignment in this area so that the text widgets are horizontal and not vertical.

I added the following code, but the text is still vertical. Does anyone have a solution? Thanks in advance!

@media only screen and (min-width: 1024px) {

.home-section-4 .widget {
display: inline-block;
float: left;
width: 33%;
}
}

.home-even.home-section-4.widget-area .widget-title {
font-size: 30px;
}

http://copywriting.novumarketing.com/

[ᴅᴀᴠɪᴅ]

The thing is, you have four text widgets in that section, including the title 'Our Services'. If it is the other three widgets only that you want to have vertical then this is a better way of doing it;

@media only screen and (min-width: 1024px) {

    .home-section-4 .widget + .widget {
        float: left;
        padding: 2%;
        width: 33%;
    }
}

.home-even.home-section-4.widget-area .widget-title {
    font-size: 30px;
}

This makes the alignment look like this http://s16.postimg.org/736appx9h/services.png
(padding there to stop the text from each widget touching each other)

---

I love helping creative entrepreneurs build epic things with WP & Genesis.

Follow on Twitter

[mspam]

David,

Thanks so much for your response! The screenshot you attached is exactly how I want the alignment to look. However, when I added the code nothing happened. I do have a multisite, so I edited the theme's CSS at the network level. Then, I network enabled the theme; switched the subdomain to another theme and then switched it back to the Parallax theme. Can you let me know what I'm doing wrong? Thanks again!

[ᴅᴀᴠɪᴅ]

from looking at your style sheet, you have put it in the wrong place. It is currently inside a media query. At the moment you have...

@media only screen and (max-width: 1140px) {
    You put the code I gave inside here, before the bracket had closed
}

You can't have a media query inside a media query, so instead put it like this..

@media only screen and (max-width: 1140px) {
     /*Lots of CSS from theme goes here*/
} /* Make sure this bracket is closed BEFORE you add the other media query */

/* Then go ahead and add the code i originally gave */
@media only screen and (min-width: 1024px) {

    .home-section-4 .widget + .widget {
        float: left;
        padding: 2%;
        width: 33%;
    }
}

/* This last bit happens outside of all media queries*/
.home-even.home-section-4.widget-area .widget-title {
    font-size: 30px;
}

Hard to explain given the constraints of the forum, but i hope you understand.

---

I love helping creative entrepreneurs build epic things with WP & Genesis.

Follow on Twitter

[mspam]

Sorry for my delayed reply. I've been under the weather. I finally got it. Thanks so much for taking the time to help!

[mspam]

Sorry for my delayed reply. I've been under the weather. I finally figured it out. Thanks so much for taking the time to help!

[jebblann]

I am trying to do something similar, but in the second widget area, without a title... I tried adjusting the code above to .home-section-2, but it didn't seem to work. I am wondering if I put it in the wrong section of style.css?

Any thoughts?

[Author]

Posts