[Anonymous]

Anonymous

#4992

I need to center images vertically on the widgets but cannot figure out how to do so. I am not HTML literate and cannot find where to go in the editor to add the top 50% bottom 50% or whatever I need to do. I have centered horizontally fine. Here is the site so you can see the issue. This client is adamant that it be centered.

http://american-hit-tek.com

[Anonymous]

Anonymous

#30191

Oops.. it is http://american-hi-tek.com

Also can you recommend an easy plugin that will allow pictures to be enlarged when clicked on but do not take you to another page. I have a thickbox I am using but then I cannot have the thumbnails different on each page.

[Anonymous]

Anonymous

#30192

Quote:

I need to center images vertically

You can wrap the image in a class and define it’s CSS attributes:

HTML

<div class="vertical_align">

<img src="PATH TO YOUR IMAGE" />

</div>

CSS

.vertical_align {

padding-top: 10px;

padding-bottom: 10px;

}

Then just change the amount to your liking.

Quote:

an easy plugin that will allow pictures to be enlarged when clicked

Thickbox:

http://wordpress.org/extend/plugins/auto-thickbox-plus/

Shadowbox:

http://wordpress.org/extend/plugins/shadowbox-js/

[Anonymous]

Anonymous

#30193

<DIV ALIGN=CENTER><nsbp><a href="http://american-hi-tek.com/bumper-step/"><div class="vertical_align">

<img src="http://american-hi-tek.com/wp-content/uploads/2012/06/American-Hi-Tek-Xtreme-Bumper-Step-1-Lg.jpg" alt="America Hi Tek Extreme Bumper Step" /></DIV></a>

So is this correct for the html in the widget?

I have no idea where to put the css part. When I go to editor there are multiple choices on the bottom that have css:

Stylesheet

(style.css)

Visual Editor RTL Stylesheet

(editor-style-rtl.css)

Visual Editor Stylesheet

(editor-style.css)

RTL Stylesheet

(rtl.css)

style-bbpress.css

style-light.css

style-print.css

Which do I go to and where in it do I go.

[Anonymous]

Anonymous

#30194

Well that did not work to send you, lets try again:

This is what I have

<DIV ALIGN=CENTER><nsbp><a href="http://american-hi-tek.com/bumper-step/"><img src="http://name of the img location" alt="America Hi Tek Extreme Bumper Step" /></DIV></a>

Is this what I need?

<DIV ALIGN=CENTER><nsbp><a href="http://american-hi-tek.com/bumper-step/"><div class="vertical_align">

<img src="PATH TO YOUR IMAGE" /></div>" width="195" height="195" alt="America Hi Tek Extreme Bumper Step" border="0"/></DIV></a>

I have no idea where to put the css part. When I go to editor there are multiple choices on the bottom that have css:

Stylesheet

(style.css)

Visual Editor RTL Stylesheet

(editor-style-rtl.css)

Visual Editor Stylesheet

(editor-style.css)

RTL Stylesheet

(rtl.css)

style-bbpress.css

style-light.css

style-print.css

Which do I go to and where in it do I go.

[Kenneth John Odle]

Kenneth John Odle

#30195

Put code in between backtick (

Code:

`

) characters. It’s usually located above the Tab key on your keyboard. http://bit.ly/backtick

If you don’t enclose code in backticks, the forum software parses the code, causing the issue you had above. I have fixed this for you.

You have improperly nested elements. Your tag structure is:

<div>

<a>

</div>

</a>

It should look like this:

<div>

<a>

</a>

</div>

I recommend you look at some of the HTML lessons at http://www.w3schools.com/html/default.asp if you need more information on this. They have good information on CSS and PHP, as well.

Quote:

I have no idea where to put the css part. When I go to editor there are multiple choices on the bottom that have css:

If you are not using a child theme, put this code in Graphene’s Custom CSS Option: Graphene Options >> Display Options >> Custom CSS (all the way to the bottom).

[Anonymous]

Anonymous

#30196

The above works in the first sidebar but when I add it to the second sidebar it sends the content and the first sidebar to the bottom of the page. Any ideas?

I have the following layout:

sidebar 2 – content – sidebar 1

[Anonymous]

Anonymous

#30197

If your widget area gets shifter to the bottom of the page… it’s usually because of a stray div tag.

Go back to each widget and make sure for every opening <div> tag… there is it’s corresponding closing </div> tag.