Remove double spacing from product attributes list?

[Danielle]

Is there a way to make the list of options on a product single spaced? You can see what it currently looks like here: http://www.babyplanetboutique.com/bi...irt-p-443.html.

I would like to either show the options single-spaced, or with less space in between.

Thanks!

[kobra]

In the stylesheet.css file find

.wrapperAttribsOptions {margin: 0.3em;}

you can set to 0

[Danielle]

That didn't change anything

[seethrou]

The space under the options line caused by the <br class="clearBoth"/>.

<div class="wrapperAttribsOptions">
<h4 class="optionName back">
<label for="attrib-81" class="attribsSelect">Shirt Style</label>
</h4>
<div class="back">
<select id="attrib-81" name="id[81]">
</select>
</div>
<br class="clearBoth"/>
</div>
<br class="clearBoth"/>

May be try the following.
Either:

1. Modify the file and remove the unwanted <br class="clearBoth"/>

OR

2. Try the following in the stylesheet.

For now your original at about line 70:

.clearBoth {clear: both;}

To reduce the line-height of clearBoth, and change it to:

.clearBoth {clear: both; line-height: 0;}

But
WARNING:
The .clearBoth used for all other pages, and it will affect all other pages!

.

[Danielle]

Yep, that works for the ones that are just text, but if any of the options have attribute images then it looks weird...I give up I can't understand why it's doing this in this version.

[kobra]

That didn't change anything

I adjusted this on screen in your css using FireFox+dev tools, and it did reduce the space. Are you sure that you did this correctly?
The file with the "clearBoth" entries that are related to this display is includes/templates/template_default/templates/ tpl_modules_attributes.php - you can copy this to your "custom" template area and safely edit it there as there is more than one & these will cause the description and the image to have a line space after.

but if any of the options have attribute images then it looks weird

Post a link to a page where the "weird" is and explain what you feel is "weird" or what you might prefer

[Danielle]

I adjusted this on screen in your css using FireFox+dev tools, and it did reduce the space. Are you sure that you did this correctly?
The file with the "clearBoth" entries that are related to this display is includes/templates/template_default/templates/ tpl_modules_attributes.php - you can copy this to your "custom" template area and safely edit it there as there is more than one & these will cause the description and the image to have a line space after.

Post a link to a page where the "weird" is and explain what you feel is "weird" or what you might prefer

Here is what's in my stylesheet:
.wrapperAttribsOptions {margin: 0em;}

As far as the clearBoth, I was editing the right file, here is a link to how it looks with dropdown attributes:
http://www.babyplanetboutique.com/bi...irt-p-443.html

It works perfectly there! But on this page, which uses radio buttons with images for the attributes, it messes up the alignment because it puts the option name on the same row as the images:
http://www.babyplanetboutique.com/go...rns-p-662.html

I know I'm just being picky, but I just want the first page to look how it does now, and the second page to look how it did before

[kobra]

Not sure what "before" was???

Try this tempoarily to see if this is in the right direction...I know it is not perfect but is it more what you want?

or do you want left=radio, name, image and then others below in a single coulmn?

Add this to the end of your css as a trial

.attribImg {
width: 25%;
float: right;
}

[Kim]

h4.optionName {line-height: 1.5em;padding: 0.2em;}

May need to change this.

[Danielle]

.attribImg {
width: 25%;
float: right;
}

That didn't seem to change anything