How do I reduce the width taken by the upvote, downvote and tick buttons in QA layout? They are taking about a third of the useful screen area which is too much.
Hi @sydchako,
Insert this CSS Code in Custom CSS Code Field at Dashboard > wpForo > Settings > Colors & Styles:
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-left {
width: 35px;
}
And this one for making the Forum Full width:
#main #content {
width: 100%;
}
@chris thank for the solution. However, a certain amount of padding has been introduced on the right hand side of the post content on mobile screen, reducing the effective width of the post. I want the posts to utilise as much width as possible on mobile screen to avoid problems when writing long chemical equations and formulae in posts and answers.
I have attached a screenshot to highlight the padding that should be reduced.
Here is another screenshot of some mathematical equation overlapping the post area because its too narrow. Can you please help me widen that post area by reducing the padding. With other layouts, the width and padding are OK, and nothing overlaps. But I can't use other layouts because they lack the QA schema, which is what I need in the QA format.
Remove the old one and use this:
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-left {
width: 35px;
}
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post{
justify-content: unset;
}
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-right .wpforo-post-content {
margin-left: 0;
}
#wpforo #wpforo-wrap .wpforo-post blockquote, #wpforo #wpforo-wrap .wpforo-revision-body blockquote{
width: 100%;
}
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-right .wpforo-post-content {
padding-right: 15px;
padding-left: 15px;
}
