cannot see whole image wordpress

jasonbournecia
jasonbournecia used Ask the Experts™
on
Struggling here.
This is my original page:
http://www.windmillhillvillage.co.uk/r65.htm
Which I though I'd try and put into my Wordpress site here:
http://www.windmillhillvillage.co.uk/r65
I cannot get to see the whole image, or get two images next to each other.
I've removed html alignments and this page is not the default template, I 've gone for no sidebar.
Now, if I put side bar on, I can se a bit more of the picture, but it puts the menu on it.
Okay, so I'm reasonably sure it is to do with styles and the theme, but I then get out of my depth.
It is left justified, so still think it is style and theme.
Any idea how I can see whole of image?
I tried making some changes to css to make it 1024 wide, but got out of hand.
I do have a child theme, but that really only changes a font colour.
Any simple pointers for a WordPress newbie aprreciated.
Cheers
John
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Why don't you just make the images smaller.

Go into your wordpress post, click on the image then click on the picture icon in the top left. A box will pop up and then on the top left you can choose a percentage of the image size. Or you can click the 'advanced' tab at the top and then set the size to whatever you want in the width and height boxes below. Click update when you are done.

You can also modify the width of the template, but that could cause some other problems to deal with.

Commented:
I noticed on the twenty-ten theme (default that installs with wordpress), they seem to have forgotten to set up the styles for the one-column template.

Here is a copy of the stylesheet that I edited for that. Make a copy of yours first then put this one on.  style.css

Author

Commented:
Thanks guys.
elliotbenzle, reducing the picture size makes the picture smaller, but it is still over to the right.
Dzynit, I've popped yours in place and I see more of the pictures, which is great, but the right side of the shots is still cropped. At least the pictures are more to the left, but the left border is still bigger than the right. I'm not too bothered by that, I just can't see why a 1024 pixel wide picture cannot be see wholy.
Become a Microsoft Certified Solutions Expert

This course teaches how to install and configure Windows Server 2012 R2.  It is the first step on your path to becoming a Microsoft Certified Solutions Expert (MCSE).

Author

Commented:
Bearing in mind that picture three and four are meant to be next to each other and are only 500 pixels wide each, so they should fit.
Commented:
Find this section in the style.css:

 
#wrapper {
	margin: 0 auto;
	width: 940px;
}

Open in new window


And set that width to 1024px. That should finish correcting it for you.

Author

Commented:
Marvellous!
Thanks Dzynit that did the trick; damn site easier under html!
Thanks again
John
As an aside, but don't bust a gut, why can't the two pictures of the exhaust, header.jpg and balance.jpg be next to each other?
They are only 500 pixels wide and I haven't got a break or paragraph seperator?
But, like I said, only if you don't mind.
Cheers
John

Commented:
I see you got it. It was just that they need the alignleft and alignright set.

I wanted to mention to you also since you're new to wordpress. You should copy and rename the theme so that when wordpress upgrades, it won't overwrite your changes.

That's pretty easy to do. Make a copy of the twentyten theme folder in wp-content/themes. Name it to something different with lowercase and no spaces. Then open the style.css and at the very top, change the "Twenty Ten" part in this line to something different:  Theme Name: Twenty Ten

Then goto wp-admin > Appearance, and activate the theme with the name you picked. This way you won't be devastated after an upgrade that everything reverted back.

Author

Commented:
Thanks Dzynit,
errmm, now don't tell me off :)
Two things, I changed the big picture to 900pixels wide and made the two smaller pictures 400 wide each. I still needed to change the wrapper though.
Re the two pictures, I did this:
`
<table style="border:none;">
<tr>
<td style="border:none;">
<img src="/images/header.jpg" alt="Rusted header" /></td>
<td style="border:none;"><img src="/images/balancepipe.jpg" alt="Rusted balance pipe" /></td><?tr>
</table>
`
I do have a verrrrrrry basic style sheet in a child theme, so I could make your change to that and hopefully, in what I've gleaned so far, it wouldn't matter about changes to Twenty Ten.
Big thanks for your input, sorry I bodged my pictures to make them work. I also put <p> before and after each picture and text to give me spacing. I know, chastise me now :)

Commented:
Sorry I didn't see this sooner. It looks like you have it covered already. Width and layout looks good.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial