How to override mobile padding on 100% site width?

[mikechops]

#455925

I have a blog that uses a sidebar, I would like to make a post occasionally without a sidebar and utilize 100% site width (but maintain normal content width). I tried setting the padding left/right padding to maintain the same content width (which looks fine on desktop) but in mobile it squishes the content making it stack. When I try to use containers/columns instead of padding, my comments and social box are still stretched.

What I’m aiming for:

|normal blog width content|
--100% width image container--
|normal blog width content|
|normal width comments and social|

Above example that still looks readable in mobile.

Thanks!

[mikechops]

#456005

Just an update after more testing, I found a fix. Please let me know if there’s a batter way, or is this ideal?

Add custom css, this resizes the non fusion builder elements to the post. (note: you must use fusion elements for your post.)

.single .fusion-sharing-box{
    max-width: (site width);
    margin-left:auto;
    margin-right:auto;
}

.single-related-posts{
    max-width: (site width);
    margin-left:auto;
    margin-right:auto;
}

.single .comments-container{
    max-width: (site width);
    margin-left:auto;
    margin-right:auto;
}

#respond{
    max-width: (site width);
    margin-left:auto;
    margin-right:auto; 

[Author]

Posts