Thread Starter
pelgen
(@pelgen)
Still unsolved for the moment. I’ve had to add another “feature” as 4 is the only number that fits the width of the page perfectly.
Hi Pelgen, I am busy with same thing with the same theme. I solved it with custom css in a child-theme I made for One Pager.
Hi pelgen,
I’ve just started playing with this in the Canvas theme by Woothemes.
I’m only able to get the features to appear in a vertical list instead of horizontally across the page.
How are you achieving that or am I doing something wrong?
Hi, these are the CSS elements I use in Woo Themes The One Pager Theme to display 3 features and 3 testimonials aligned on the homepage.
/* Features By WooThemes Widget */
.widget_woothemes_features .feature {
float: left;
width: 29.8%;
margin-right: 0;
margin-left: 5.3%;
}
.widget_woothemes_features .feature.first {
margin-left: 0;
}
/* Testimonials By WooThemes Widget */
.widget_woothemes_testimonials .quote {
float: left;
width: 29.8%;
margin-right: 5.3%;
}
Really wish the dev to solve this issue, e.g. auto resize the width of each feature or testimonial item based on the ‘per_row’ parameter…
@sjefx: Thank you for the code, now the next issue. When I dump that into my custom CSS the mobile renders with the features across the screen instead of as separate items vertically, which is how they render with the 4-to-a-row original CSS. Thoughts?
@dynamicoils: I did not really look at that, but is has to do with media queries. I used the widget shortly in the WOO One pager theme. Now the default design in that theme is for a small screen with features vertically aligned (width=100%). When the size is above 768px it changes to horizontal aligned features (width=29.8% with 3 features). When this is also the case in the theme you are using, it depends on where you paste the above CSS. The settings above should only overrule the CSS meant for a screensize of 768px and above.
