Custom Width for Ryu Theme

janelou · Member · Apr 23, 2013 at 6:41 pm
Copy link

Add topic to favorites
I just purchased Custom Design, and I’m not sure if this issue has already been posted, but I can’t seem to find it. I’d like to change the content width (to 910px), but whenever I press save nothing happens. I also tried entering the CSS code #container{width:910px;}, but nothing happens. Is it possible to change the content width? Thanks!

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Apr 23, 2013 at 6:55 pm
Copy link
CSS is theme specific and the theme you are using does not use “#container, and the way the theme is designed, you have to target a more specific selector for changing the content width. In addition, since your theme is a responsive design, you don’t want to set a “width” you want to set a “max-width” so that the theme will still respond properly to varying screen sizes, such as on smartphones an tablets. Instead of what you have, add the following.
```
#main {
max-width: 910px;
margin-left: auto;
margin-right: auto;
}
```
janelou · Member · Apr 23, 2013 at 7:03 pm
Copy link
I see… I tried this code instead, but it just made the header bigger, not the content.
thesacredpath · Member · Apr 23, 2013 at 7:34 pm
Copy link
Sorry, the CSS in this theme is quite complex. To widen the content area, in addition to what I’ve given above, add the following and see what you think.
```
.entry-content, .entry-summary {
max-width: 860px;
}
```
janelou · Member · Apr 23, 2013 at 7:44 pm
Copy link
It changes the content width, but the margins remain fixed, and the images (which are updated at 910px) aren’t changing either. I uploaded screenshots on Flickr in case it helps.

This is what I’d like:
http://www.flickr.com/photos/janelou/8675261639/in/photostream

And this is what is happening:
http://www.flickr.com/photos/janelou/8675261609/in/photostream/
janelou · Member · Apr 23, 2013 at 7:45 pm
Copy link
(which are uploaded* at 910 px)
thesacredpath · Member · Apr 23, 2013 at 7:55 pm
Copy link
Add 50px to the 910 number and 50px to the 860 number.

In the publish module on the custom CSS page, make sure and set the “content width” to 910 too.
janelou · Member · Apr 23, 2013 at 8:03 pm
Copy link
Thanks! That worked, except I had to set 910 to 1100. But I’m still wondering why the images are still displayed at 860px, even though they are uploaded at 910px.
thesacredpath · Member · Apr 23, 2013 at 8:06 pm
Copy link
You may have to delete the image in the post and then reinsert it at full-sized. It could be that the software created a downsized image to fit the original dimensions.
janelou · Member · Apr 23, 2013 at 8:08 pm
Copy link
That did the trick! Thank you so much for your time!! :)
thesacredpath · Member · Apr 23, 2013 at 8:25 pm
Copy link
You are welcome.
originphoto · Member · Apr 24, 2013 at 12:35 am
Copy link
I’m having a similar problem with my blog … http://www.originphotoblog.com

I’m trying to make the width wider so that I can display my photos as big as possible (1224px).

It’s a linen theme. I tried the things you’ve suggested, but I haven’t had any luck. I’m not sure if I’m doing it right though.

Any help would be greatly appreciated!
thesacredpath · Member · Apr 24, 2013 at 3:36 am
Copy link
@originphoto, since you are using a different theme, can you please start a new thread in the css forum so that things don’t get confusing for anyone coming to this thread about the Ryu theme? CSS is theme specific.

Thanks in advance. I’ll watch for your new thread.
originphoto · Member · Apr 24, 2013 at 2:33 pm
Copy link
Thank you @thesacredpath

I just started a new thread. After looking through your site a bit, I bet you’d enjoy reading The Power of Now by Eckhart Tolle. I read it a few years ago and I think about it everyday. :)
thesacredpath · Member · Apr 24, 2013 at 3:17 pm
Copy link
That is the second recommendation I’ve gotten on that book. I think it is now on my reading list, and thanks for stopping by my seriously neglected blog.

No items found.