Text colliding with image

I am attempting to have image, and text directly to the right of that image. However, the text seems to be colliding with the image. I tried to use the bootstrap class pull-right, but no luck. Any suggestions?

<div class="container">
     <h1>About Me</h1>
    <div class="row">
        <div class="col-md-4">
                <img width="720" height="520" src="img/tweeter.jpg" />
        <div class="col-md-5">
            <p>Lots of text here...With the four tiers of grids available you're bound to run into issues where, at certain breakpoints, your columns don't clear quite right as one is taller than the other. To fix that, use a combination of a .clearfix and o</p>

I think that’s because you are giving set width within your grid therefore overflowing. Make your image responsive by giving it a bootstrap class name.

1 Like