I thought I would elaborate on my initial post…… what I am trying to do is to modify my Autofocus+ Pro site and :
1. Change the site width to 1000 pixels from 800 pixels
2. Display 1000px width pictures in the single-post section (currently they display in a 1000 pixel area but I just get a 800/794 pixel size photo with a grey background).
3. Have post-images on the blog-grid align correctly with just a maximum of 9 or 10 posts.
Can anyone help here? I’ve just added an image for the top 5 posts on my site.
Here’s what I have done so far…..
1. I’ve edited my autofocus style.css so all 800 pixels are removed from just the “layout” section (I’ve added +200 to these values):
/* Layout
-------------------------------------------------------------- */
body {min-width:1032px}
#header {width:1000px; margin:22px auto;}
#access {position:relative; overflow:hidden;}
#wrapper {position:relative;z-index:20}
#main {width:1000px; margin:0 auto; padding:0;overflow:visible; position:relative;z-index:25}
#container {width:1000px;display:table;padding:0; margin:0 0 66px;}
#content {margin:44px 0 0; width:1000px; overflow:visible}
.main-aside {width:392px; float:left; position:relative;}
#secondary {clear:right}
#footer {clear:both; width:1000px; margin:0 auto}
#subsidiary {width:1000px; margin:0 auto; overflow:hidden}
#siteinfo {clear:both; }
2. I’ve made changes to the default-layout.css (as this is Autofocus +Pro) in order to try and ensure that the 1000 pixel table is adhered to but this doesn’t seem to reflect in the blog-grid as it’s now back to showing around 800 pixels
.blog #content .hentry.p1 {width:664px;margin-right:5;}
.blog #content .hentry.p2 {width:330px;}
.blog #content .hentry.p3 {width:330px;margin-right:5;}
.blog #content .hentry.p4 {width:330px;margin-right:5;}
.blog #content .hentry.p5 {width:330px;}
.blog #content .hentry.p6 {width:330px;margin-right:5;}
.blog #content .hentry.p7 {width:665px;}
.blog #content .hentry.p8 {width:664px;margin-right:5;}
.blog #content .hentry.p9 {width:330px;}
.blog #content .hentry.p10 {width:664px;margin-right:5;}
Note that if I restore these lines back to their defaults, I get a wider grid (the top post-grid-box is by default set to 100% and so fills 1000 pixels), but the remainder are staggered as if I am missing posts (but I’m not)
3. I’m pretty sure that in order to get 1000 pixel posts in the single-post area, I’ll have to alter function.php or some other file. After reading thru loads of posts I’ve tried // commenting out the ‘$_GLOBALS[content_width] = 494’; line in function.php but that didn’t seem to make any difference.
So, 3 problems.
1. 1000 pixel width isn’t working
2. Blog-grid isn’t aligned properly, and
3. Pictures on single-post page are not 1000pixels, and
If anyone has had similar issues and could advise that would be great. I’m losing the will to live ??
Blog is at https://www.hopkinsphotography.co.uk/index.php/blog-2/
Thanks, Dave.