CSS code to widen main column in blog posts

  • Author
    Posts
  • #2595034

    Gordon, what is it exactly that you are looking for on this? The two images on Orval Day 2016 are center aligned, so they are to the right a bit. If that is what you are concerned with, open that post and set the alignment for those two images to “none” and they will shift to the left.

    #2595035

    Hi Richard-

    I removed the CSS code you gave me and returned it back to its original state.

    Instead of trying to explain what I would like in words, I created a page with a visual to better illustrate my desired effect. I hope it makes sense to you!

    http://belgianbeerjournal.com/example-of-desired-blog-column-layout/

    #2595037

    Gordon, thanks much for the images and explanation. This is going to be a bit tough due to the way the blog page HTML is structured on Sela. Give this a try and see what you think.

    .blog .site {
        padding-left: 55px;
        padding-right: 55px;
    }
    .blog .site-content {
        padding-left: 0;
        padding-right: 0;
    }
    .blog .post-thumbnail {
        margin-left: 0;
    }
    .blog .content-area {
        max-width: 870px;
        width: 100%;
    }
    .blog .post-thumbnail {
        margin-left: 0;
    }
    .blog .post-thumbnail img {
        width: 100%;
        margin-right: 55px;
    }
    .blog .post-thumbnail {
        width: 100%;
    }

    After adding the above, in the Media Width field below the CSS input area, enter 724 and then save and look things over on phones, tablets and your computer and let me know.

    #2595038

    Hi Richard-

    I input the code… It looks great on a laptop or PC, but it drops the main sidebar down to the bottom in a iPad mini, (I think the main sidebar was down to the bottom in an iPhone even before the CSS tweaks) so… I’ll have to think about this. I had a feeling the increased width would shift things in an iPad… :( Thank you for your time and effort!!

    -Gordon

    #2595039

    Hi again, Richard-

    I removed all the CSS code, and it does display better in iPads an iPad minis. It remains unchanged in iPhones, however. Oh well… I thought I would try. Sorry to put you through all that!

    -Gordon

    #2595042

    Sorry we didn’t get there for you, Gordon.

    #2595043

    juliepayten
    Member

    Hello,
    Can you please help with he CSS formatting of my Janice theme blog? I can’t for the life of me work out how to widen the post and the post heading? its all sitting on the far left side of the screen?

    Thank you

    #2595044

    codigo29
    Member

    Hi. I wanted to ask for help on the main entrance of my blog. I use the theme ‘expound’ and I want to look bigger the title of the main entrance. I have tried several CSS codes but can not. I hope you can help me.

    This is my web http://www.codigo29.com

    #2595046

    Hi @codigo29 and @juliepayten, since you are both using a different theme, and since CSS is generally theme specific, can I ask you to create a new thread in the CSS Forum? Many thanks in advance.

    #2595063

    Hello again!

    I am wondering… is it possible to have a pop-up window verifying if a site visitor is 21 at least years of age? I would like this, since my site is based in the beer industry.

    -Gordon

    #2595064

    Hi Gordon

    A pop-up like you are requesting will not be possible on a WordPress.com site as plugins are not permitted, though it may be possible on a self-hosted WordPress site (also known as WordPress.org).

    To learn more about the difference between WordPress.com and WordPress.org, take a look at http://en.support.wordpress.com/com-vs-org/

    Hope this helps!

The topic ‘CSS code to widen main column in blog posts’ is closed to new replies.