How to make blog posts wider

  • Unknown's avatar
    lilgq · Member ·

    Hey, I’m new to almost everything when it comes to CSS and when I read the past forums, I really lost myself. I purchased the CSS customization and a domain.. I thought paying would be the easy part. But, all I want to know is how to widen my posts so that the images/video aren’t cut-off. here’s my site LilGQ.com .. I really want to re-vamp the whole site but I have lots of CSS customization to learn. Any help is appreciated.

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    First off, only put into the CSS edit window exactly what you are changing. Do not paste the entire stylesheet. It will cause you a lot of grief. Below is what you need to paste into the CSS edit window. You then need to figure out how much wider you want to go and add that amount to the widths and margin-left declarations. One thing to keep in mind is that a large portion of people out there are still on 1024 x 768 resolution monitor settings, so my suggestion is to not go wider that 980px for the #page width or people will have to scroll horizontally, and that is #3 in the top ten things people hate on the web. If you go with 980px for width of #page, then add 220 (980 – 760 = 220) to each of the numbers below.

    #page {
width:760px;
}

#sidebar {
margin-left:545px;
}

.narrowcolumn {
width:450px;
}

.widecolumn {
width:450px;
}

    Also, you will see a “Limit width to…” below the CSS edit window. Increase the number shown there by the same amount used above. That will keep images and videos from being inserted too wide for the post area and breaking the theme.

  • Unknown's avatar
    thesacredpath · Member ·

    Also before saving the changes, make sure that “add to existing…” is selected.

  • Unknown's avatar
    tanyaslogos · Member ·

    Theme: Kubrick theme.

    Problem: There are internal style codes being used on this theme to control the page id (which displays a different background depending on if you are on the home page or a post page).

    Unfortunately if I override both of the internal style codes by using the !important attribute it displays the same background for both page types.

    Since the sidebar isn’t displayed on the post pages it looks silly having the same background as the home page (with the sidebar bg color included in the image)

    So how do I fix this? These two pages should use separate ID’s or at the very least include separate classes. Since I can’t get to the code I my hands are kinda tied.

    Sincerely,
    Tanya

  • Unknown's avatar
    raincoaster · Member ·

    Frankly, Kubrick is a really nasty theme to work with. You might want to try another of the BBH (Big Blue Header) themes.

  • The topic ‘How to make blog posts wider’ is closed to new replies.