WordPress HTML code tag not responsive

How do I control the width or responsive width of the CODE tag in a WordPress post?

Under the comments section on this post, the text, “You may use these HTML tags and attributes:” and the code elements after it, doesn’t fit the width of the container of this responsive website design.

Read More

This line of code examples simply extends out past the container it’s in. Here’s the post I’m working on:

http://www.flippinlaw.com/what-is-sound-financial-advice.html

I’ve noticed the issue in 3 different browsers and it seems to be a bootstrap related style. Any help is appreciated greatly. Thanks!

Related posts

Leave a Reply

2 comments

  1. Adding display:block to the code tag looks to work for me

    code {
        display: block;
    }
    

    Add it to your style.css file

    edit
    Note that will change it for every code tag on the site, so in case you don’t want to do that you can either add it inline to that particular code tag (which isn’t really the best idea):

    <code style="display:block;"></code>
    

    Or create a class for it:

    code.code-block {
        display: block;
    }
    <code class="code-block"></code>