Adjust width of Disqus comments

By default Disqus covers up 100% of the width of your blog. If your design is a bit different like mine then this might be a problem as while scrolling Disqus might overlap certain elements on the page.

How to change the width of Disqus comments block?

If you will see the Disqus code:

Now this code does not have any width element, so we need to follow the CSS method.

The CSS way:

Just create a div element with a class as follows:

After this you need to add properties to this element in your CSS file:

To check how much width you need, check that by playing with Google Devtools. I have set mine at 70% width.

You can checkout <a href="https://help.disqus.com/customer/portal/articles/545277-disqus-appearance-tweaks"target="_blank">this</a> article for more tweaks and customizations with Disqus comments.