CSS Code for extending content width

  • Author
  • #1322183



    I have the Watson theme and have upgraded to Premium. I am new to wordpress and CSS formatting. My question today is my text margins don’t align with my image. I understand I can align the image and wrap the text when inserting media, but if I want the image to be inserted as a “featured image” I believe I lose the alignment option. How can I adjust my text to extend to the far right margin of the image associated with the post? Thank you .

    The blog I need help with is hausvonsalz.com.



    Hi there,

    Thanks for bringing this up. It might be a problem with the theme itself. We’re looking at it!


    The Watson theme has some unique design elements that shift different parts of the content outside the typical margins for the post. You can see it a little more clearly in this example post from the Watson demo site because it has a blockquote section that shifts to the left in addition to the featured image access to the right:

    You can adjust that manually using custom CSS if you’d like.

    Here is an example to get you started if you want to adjust the image size to match the current base text column width:

    .feature img {
    	width: 492px;
    	height auto;
    	padding-right: 115px;

    You could also adjust the text column, but that might cause some unintended consequences if you ever do use some of the content types that are meant to fall outside of the regular text margins.



    Hey again,

    You may also like this other solution, which keeps the responsiveness of the layout (i.e., the fact that the layout readjusts itself according to the dimensions of the browser window):

    @media screen and (min-width: 900px) {
        figure.feature {
            float: none;
            margin-left: auto;
            margin-right: auto;
            max-width: 492px;

    Thanks @miguelcsf! Your solution is better. :)



    Hey! I’m new here and i don’t really know how to go about, please tell me how to make my worldpress.com blog appear in search engines so that i get traffics to my new posts and updates? Please help me with the code or tutorial. Thanks.



    You are thread hijacking by posting an off-topic question into this thread. Please click this link and start your own thread > https://en.forums.wordpress.com/?new=1



    P.S. Also remove all those irrelevant tags form the sidebar of this thread please.

The topic ‘CSS Code for extending content width’ is closed to new replies.