Feature Area - change to only 3 columns

How can I drop one column from the Feature Area. Instead of 4 I want to have 3 columns - centered.

 

Hello,

You can easily resolve your issue with CSS code, you just only have to paste the code given below in Custom CSS section (Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

.feature_inner_box.fourth {
    display: none !important;
}
 
.feature_inner_box.second {
    margin-left: 142px !important;
}
 
.feature_inner_box.third {
    margin-left: 278px !important;
}

Note: Change numeric value as per your requirement.

Hope it will resolve your issue

Do let me know if you need more assistance,

Thanks & Regards!
Priyanka
InkThemes.com

 

Thank you for the prompt reply. This fix did work on a full size device.
But columns are not centered on smaller devices(see attached Screenpresso).
Is there a way to drop the column that does not hurt responsive scaling .

Rick

 

Hello Rick,

Could you please provide us 'URL' of your site so that we can better assist you?

Thanks & Regards!
Priyanka
InkThemes.com

 

Priyanka

The site is at http://barnatstratford.org/wp/
View the site on a tablet or simply resize the browser to 6" to see what I sent in the image.

Thank you for your continuing assistance

Rick
DCHS Volunteer

 

Hello Rick,

Use this code (given below) in Custom CSS field of your dashboard.

Code:

@media only screen and (max-width: 960px) and (min-width: 767px){
.feature_inner_box.third {
    margin-left: 182px !important;
}
.feature_inner_box.second {
    margin-left: 97px !important;
}
}
@media only screen and (max-width: 767px) and (min-width: 480px){
.feature_inner_box.second, .feature_inner_box.third {
    margin-left: 0;
}
}
@media only screen and (max-width: 480px){
.feature_inner_box.second, .feature_inner_box.third{
    margin-left: 0;
}
} 

Hope it will resolve your issue

Do let me know if you need more assistance,

Thanks & Regards!
Priyanka
InkThemes.com

 

Thank you for your continued assistance.
The 1st new code section properly aligns the three columns.
The 2nd and 3rd new sections (the two smallest sizes) do not see to be setting the left margin to zero.
I am viewing the site through Firefox if that can make a difference.

Rick http://barnatstratford.org/wp/

 

Hello Rick,

Could you please share your dashboard details at [email protected] along with this thread link and we will do it for you..

Looking forward to your reply.

Thanks & Regards!
Priyanka
InkThemes.com

 

I would like to change the 4 featured areas on the home page into 3 featured areas. How do I do that.

 

Never mind. I found where you answered my question with someone else. Mercy me your good.

 

Greetings from InkThemes,

It would be our pleasure to serve you.

I really appreciate your efforts in exploring the things and sharing your knowledge here.

It seems that you have resolved your issue by your own.

Let me know if you have further doubts so that I can assist you.

Thanks & Regards!
Nitin
InkThemes.com

 

I tried using this code on the site but it added back the forth column that previous code you gave me commented out. The issue is that The three feature areas do not line up centered over each other when viewed on a smart phone. The first one is centered and the other three are off the viewing area. How do I correct that?
smartandsafeal.com is the site. When viewed on a monitor its perfect when viewed on a smart phone, not so perfect.

 

I tried using this code on the site but it added back the forth column that previous code you gave me commented out. The issue is that The three feature areas do not line up centered over each other when viewed on a smart phone. The first one is centered and the other three are off the viewing area. How do I correct that?
smartandsafeal.com is the site. When viewed on a monitor its perfect when viewed on a smart phone, not so perfect.

 

Hello,

Sorry, I am unable to open your site.

Kindly check..

Thanks & Regards!
Priyanka
InkThemes.com

 

Hi! Both the codes didn't work for me (with ColorWay theme in Safari on Mac) neither. Would be grateful for any suggestions! http://olaf-kellerhoff.de

 

Hello Kellerhoff,

Let me tell you that the above code is for Traffica theme not for ColorWay theme..

Hope you will understand..

Thanks & Regards!
Priyanka
InkThemes.com

 

Dear Priyanka,
many thanks for your quick reply! No, I wasn't aware. Even now when I search for the theme name in this thread I couldn't detect it. Anyhow, do you have a solution for ColorWay?

Looking forward to hearing from you.

Best regards,

Olaf

 

Hello Olaf,

Please follow the screenshots given below.





And also paste the code given below in Custom CSS section (Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

.columns .one_fourth {
    margin-left: 73px;
}
@media only screen and (max-width: 1260px) and (min-width: 960px){
.columns .one_fourth {
    margin-left: 63px;
}
}
@media only screen and (max-width: 960px) and (min-width: 768px){
.columns .one_fourth {
    margin-left: 177px;
}
}
@media only screen and (max-width: 767px) and (min-width: 480px){
.columns .one_fourth {
    margin-left: 0px;
}
}
@media only screen and (max-width: 480px){
.columns .one_fourth {
    margin-left: 0px;
}
}

Hope it will resolve your issue

Do let me know if you need more assistance,

Thanks & Regards!
Priyanka
InkThemes.com

 

Dear Priyanka,

many thanks for your efforts! It's great: It worked - except for one thing: now the whole area has blue background. have a look olafkellerhoff.com. But should be easy to turn it back into white - right? Would you be so kind to tell where I could do that? Would be highly appreciated.

Many thanks in advance!

Kind regards,

Olaf

 

Hello Olaf,

I have checked your site and it seems that you have missed out something during following the process....

So would you please send us your dashboard credentials at [email protected] along with this thread link so that we can figure out the issue and able to resolve in your site...

Or, you are kindly suggested to follow all the above steps carefully once again and check after that..

Looking forward to your reply.

Thanks & Regards!
Priyanka
InkThemes.com