Photo Selection Boxes – Formatting Problems

[cranwinks]

The table where you choose the image quantity, size, and price, etc. doesn’t look like the demo. It looks like the table should be wider, the text looks fuzzy, and some of the items aren’t centering in the boxes. Please have a look:

[http://www.erinoneillphotography.net/photogallery/photo_details/?gallery_id=1&image_id=1870]

and let me know how I can solve this problem.

Thanks!

[Peter]

Hi,

Your page appears to have some kind of slider which is probably being inserted by default from your theme.

Can you please remove that slider and any other extra things being added by your theme such as that zoom icon too.

Also, can you try setting the page template for that particular page to a standard full width setting?

[cranwinks]

I did as you suggested, but still the order selection table doesn’t look right on the Photo Details page. Any other ideas? Here’s a link to the page again:

[http://www.erinoneillphotography.net/photogallery/photo_details/?gallery_id=1&image_id=1870]

Any help would be greatly appreciated!

[cranwinks]

I would like to make the table 500 px wide. I played with the code in Firebug, and am able to create the 500 px wide table. However, the first column, under Quantity, gets too wide. I’d like to keep that at about 55 px wide. Can you give me the css to plug into the custom styles to accomplish this?

[Peter]

Your theme’s CSS is messing that up a little. You can fix it by doing the following:

1) Go and grab the following plugin:

http://www.tipsandtricks-hq.com/wordpress-custom-css-plugin-6413

2) Then add the following CSS code in the settings of the above plugin:

.wps_digital_details_table{

width: 70%;

text-align: left;

margin-bottom: 15px;

}



.wps_digital_details_table td{

border-top: 1px solid #ededed;

padding: 6px 10px 6px 0;

}



.wps_digital_details_table{

width: 70%;

text-align: left;

margin-bottom: 15px;

}



.wps_digital_details_table tr td{

text-shadow: none;

}



.wps_digital_details_table tr th{

text-shadow: none;

}



.wps_photo_details_navigation_links a{

color: #000;

text-shadow: none;

}

Feel free to make your own adjustments to the code I have given you.

[cranwinks]

Thanks, I appreciate the help. I’ve installed the plugin and inserted the code. Looks pretty good. Now I’m going to tweak it a bit to suit.

Thanks again!

[cranwinks]

Hi Again,

Your solutions worked, but I’m having some trouble modifying the css for other things on the Photo Details page. For instance, I would like to play around with the table background colors. When I use Firebug to find the code, I can make the changes in Firebug to see the desired results. But when I copy the code and paste it into the Custom CSS, the changes don’t stick. For instance, I used Firebug to find this code for the background color of the light gray table row:

.wps_digital_details_table .wps_tr_even {

background: none repeat scroll 0 0 #F3F3F3;

}

When I paste that into the Custom CSS, and then modify the color value to say a dark gray (666666), and then save the changes, the changes don’t appear on the front end.

Any idea what I’m doing wrong?

[cranwinks]

P.S. I am using the hash mark before the color value: #666666;

[cranwinks]

P.P.S. Again, here’s the link to the page I’m working on:

[http://www.erinoneillphotography.net/photogallery/photo_details/?gallery_id=1&image_id=1870]

[Peter]

Just do this:

.wps_digital_details_table .wps_tr_even{

background: #666666 !important;

}

[Author]

Posts