Cars and Code goes wide track – A wider screen for Elegant Grunge

  • Author
  • #693152


    I built a wider screen version of the Elegant Grunge Theme using the custom CSS upgrade feature of The blog post above explains how I did it.



    It looks like this got moved into CSS Customization instead of Themes where I had originally posted it.


    I was going to ask someone to do that for me.


    Great article! :) I like that you talked about having the content area wide but not too wide. I’m curious how you settled on a limit width of 810?

    Also, as I was reading, I wished for the line height to be a little taller with the wider content area. What do you think?

    .post .entry {
        line-height: 1.5em;

    It also might be worth mentioning that the changes are specific to the Content-Sidebar layout (the default one) in the Appearance → Theme Options settings for Elegant Grunge.



    Thanks! I do like the bigger line height. It’s now included.

    I thought that I did mention that I used only the Content-Sidebar layout, but I guess I could make it clearer?

    I’m not using the two sidebar style, nor the rtl style (right to left), but there are images for those too.



    The width was sized based on my desire to have the content fit on a 1024 pixel wide device (like the iPad). I really would have liked a bit wider for my own use, but I figured I wouldn’t push it too much.

    I’ve added the following to the article based on your suggestions:

    That means that of the four choices for elegant grunge in Appearance -> Theme Options: Content-Sidebar, Sidebar-Content, Content-Sidebar-Sidebar, and Full Width (No Sidebar), these modifications only modify Content-Sidebar and Full Width (No Sidebar). If you want to use the other options then you’ll have to update the images yourself.


    I used the Full Width (No Sidebar) theme option (which is used on the Rich Soule Racing Page, see the image at the left) as my test and at a content width of 955 pixels everything fit on the screen without much space to spare. When using the Content-Sidebar theme, I played around with sizes until the images for the date of the post didn’t overlap the vertical line separating the content body from the sidebar.

The topic ‘Cars and Code goes wide track – A wider screen for Elegant Grunge’ is closed to new replies.