Gap between Attributes

[starcad]

Let me get the basic information first.

Thought I was using the latest version but see there has been an update.

Version Zen Cart v1.3.7.1/v1.3.7.1

Template Gloss Black

Add-On's Only add on is CSS Drop Down Menu

Customized A lot of the normal things like side boxes, log in header footer have been turned off. This is so that I may insert it into an I-Frame to coincide with the theme of my site.

Database Host: localhost (127.0.0.1)
Server OS: Linux 2.6.18-128.2.1.el5
Database: MySQL 5.0.45
Server Date: 07/24/2009 23:55:37
Database Date: 07/24/2009 23:55:37
Server Up Time: 23:55:37 up 23:37, 0 users, load average: 0.00, 0.00, 0.00
PHP Version: 5.1.6 (Zend: 2.1.0)
HTTP Server: Apache/2.2.3

OK, now for the question. I've searched the forums for the last week and tried several, what I thought, solutions to the issue. When I add attributes to a product page I get a gap between the first attribute and the second attribute. See the image below.

Also a link to the page would be Click here

I'm stuck after pouring over dozens of threads and can't seem to find a way to get rid of that, BLANKETY, BLANK, BLAND, GAP. Looking for possible solutions.



Thanks
Guy Fuller

[niccol]

The gap is there because the add to cart box is floated right.

The attributes are floated left but have a clear;both after them. This means that the second one is pushed down beneath all the active floats. ie beneath the add to cart box as well.

In the source code you'll see: for instance:

<div class="wrapperAttribsOptions">
<h4 class="optionName back"><label class="attribsSelect" for="attrib-1">Color</label></h4>
<div class="back">
<select name="id[1]" id="attrib-1">
  <option value="1">White</option>
  <option value="2">Black</option>
  <option value="3">Red</option>
  <option value="4">Blue</option>

  <option value="6">Green</option>
  <option value="7">Orange</option>
  <option value="5">Yellow</option>
  <option value="8">Silver</option>
  <option value="9">Lt. Blue</option>
</select>

</div>
<br class="clearBoth" />

It is the <br class="clearBoth" /> that is pushing them this way.

This is found in the file.: tpl_modules_attributes.php. The .back that is appearing in the code is effectively a float:left.

I am just going to go and see if I can find a post I remember about why it is a bad idea to have zen cart in a iframe like this!

[niccol]

Have a read of:

http://www.zen-cart.com/forum/showthread.php?t=130066

[niccol]

The nasty fix that doesn't involve doing the right thing with the various floats is to change in the stylesheet:

#cartAdd {
	float: right;
	text-align: center;
	margin: 1em;
	border: 1px solid #000000;
	padding: 1em;
	}

to-

#cartAdd {
position:absolute;
right:10px;
	text-align: center;
	margin: 1em;
	border: 1px solid #000000;
	padding: 1em;
	}

Works but it is not 'nice'.

[starcad]

Thanks Niccol, I hate to say it but you really busted my bubble, three months of working very hard to get this to look just the way I wanted. Oh well, I'll take your advice and download the latest version and work from there. Was it worththe effort? Yes! Humm! With all the features of the new version I can probably make it better as I'm getting a very good feel for Zen. Thanks for your reply. Now lets see what I can come up with. If this had an "add a friend" feature, you'd be on it in a heart beat as you gave me just the information I needed and provided extra effort in pointing me in a different better direction.

Thanks you - Guy Fuller

[starcad]

I think we can mark this closed. As for anyone trying what I was, Don't waste the effort. I looked at the security of the I-frame issue and was amazed at what I found. Along with the Paypal ISP issues, it's not worth your time.

Guy

[niccol]

Sorry. That must have been heart-breaking. The good thing is that it will take you a fraction of the time this time round now that you have found your way around zen cart. Good luck

Sorry again