How to hide Blogger's sidebar on mobile

Question

https://www.journeybytes.com/2018/11/hide-blogger-sidebar-on-mobile.html

I tried the method mentioned in the link above (code shown below), but on mobile the sidebar still occupied a blank space with its original width. How can I make the side column totally disappear on mobile so that the main column can dynamically expand to a full width? (The main column of my Blogger has already been assigned a dynamic width.)

P.S. I wand codes that can work without enabling the mobile theme on Blogger.

<aside>
<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
... sidebar content code here ...
</b:if>
</aside>

(Updated) I am providing my blog below in case the effect of the code depends on the web design. Thanks.

http://mkhere.blogspot.com/?m=0

Answer 1

Try this

<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
    <aside>
        ... sidebar content code here ...
    </aside>
</b:if>

Updated:

From your blog layout, you also need to remove padding-right: 200px; from main column .main-inner .columns on mobile

<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
    <style>
        .main-inner .columns {
            padding-right: 0;
        }
    </style>
</b:if>