Support › Forums › Flex Theme › Can't get 4 columns on HP
- This topic has 15 replies, 3 voices, and was last updated 5 years, 2 months ago by
tblogster.
-
AuthorPosts
-
June 28, 2015 at 11:15 am #363
tblogster
ParticipantHi,
I’m trying to use the Genesis Featured Page widget to get 4 columns of featured pages of the homepage.
I have selected img-4-columns however it doesn’t seem to work and my pages are stacked in two columns.
You can see them on the homepage below the big banner here:
http://ipaintbynumber.com/
Please guide me as to how I can fix this
Thanks!June 28, 2015 at 12:22 pm #364Chinmoy Paul
ModeratorYou need to modify the style.css file. Replace this existing CSS
.one-third, .two-sixths, .home-middle .featuredpage { width: 31.623931623931625%; }
BY
.one-third, .two-sixths { width: 31.623931623931625%; }
Now you will replace this one
.one-fourth { width: 23.076923076923077%; }
By
.one-fourth, .home-middle .featuredpage { width: 23.076923076923077%; }
=====================
Add this new CSS in your style.css file
#featured-page-3 {
clear: both;
margin-left: 0;
}June 28, 2015 at 6:02 pm #365tblogster
Participantthat worked thanks!
July 7, 2015 at 8:10 am #409tblogster
ParticipantHaving the same problem with a second row of featured pages on the same homepage. is this going to happen every time?
How can I fix in this case?
thanksJuly 7, 2015 at 12:35 pm #410Chinmoy Paul
ModeratorRemove this CSS
#featured-page-8 { clear: both; margin-left: 0; }
Replace current CSS
#featured-page-3 { clear: both; margin-left: 0; }
By
#featured-page-3, #featured-page-11 { clear: both; margin-left: 0; }
August 11, 2015 at 9:33 pm #470gali
ParticipantI’m having the same problem and tried as you said but still not working for me. Can you please check it here http://cheers-2-wine.com
Thanks
August 12, 2015 at 2:15 am #471Chinmoy Paul
ModeratorThis is for @gali
Replace this CSS
.first, .home-middle .featuredpage:nth-of-type(3n+1) { clear: both; margin-left: 0; }
WITH
.first, .home-middle .featuredpage:nth-of-type(4n+2) { clear: both; margin-left: 0; }
August 12, 2015 at 2:46 pm #484gali
ParticipantYes! thanks so much – it works great now. 🙂
August 13, 2015 at 1:34 pm #486tblogster
Participantthose four columns are still not arranging themselves properly for me. any tips?
August 13, 2015 at 1:53 pm #487Chinmoy Paul
ModeratorRemove the following css from style.css file
#featured-page-3, #featured-page-11 { clear: both; margin-left: 0; }
========================
Now replace the following CSS
.first, .home-middle .featuredpage:nth-of-type(2) { clear: both; margin-left: 0; }
with
.first, .home-middle .featuredpage:nth-of-type(4n+2) { clear: both; margin-left: 0; }
-
This reply was modified 5 years, 5 months ago by
Chinmoy Paul.
August 13, 2015 at 2:11 pm #489tblogster
Participantcloser but still not quite right.
see here;
http://ipaintbynumber.com/August 13, 2015 at 2:19 pm #490Chinmoy Paul
ModeratorYou did not properly follow my instruction.
Replace (line no 2783 )
.home-middle .featuredpage:nth-of-type(4n+3) { clear: both; margin-left: 0; }
WITH
first, .home-middle .featuredpage:nth-of-type(4n+3) { clear: both; margin-left: 0; }
Remove this CSS (line no 711)
.first, .home-middle .featuredpage:nth-of-type(2) { clear: both; margin-left: 0; }
August 13, 2015 at 2:28 pm #491tblogster
Participantunfortunately that did not help.
please review.
thanks for your patience.November 3, 2015 at 1:08 pm #624tblogster
Participantthe site is almost finished and then this problem suddenly started happening again.
see here
http://ipaintbynumber.com/
please help
thanks!November 3, 2015 at 1:21 pm #625Chinmoy Paul
ModeratorReplace this CSS
first, .home-middle .featuredpage:nth-of-type(4n+3) { clear: both; margin-left: 0; }
WITH this
first, .home-middle .featuredpage:nth-of-type(4n+2) { clear: both; margin-left: 0; }
-
This reply was modified 5 years, 5 months ago by
-
AuthorPosts
- You must be logged in to reply to this topic.