Author Topic: Browse page alterations  (Read 2595 times)

trader4300

  • Beginner
  • *
  • Posts: 23
Browse page alterations
« on: May 23, 2008, 16:23:21 pm »
Having problems with my browse page with text and images overlapping. The browse_2 page has the "add to cart" button half off the page. I condenced things
down by removing all the formatting as shown below. This cleaned everything up and put all my products in 2 neat columns. What I dont understand, is where in the code does it define the start of the 2nd column? I dont see where there is a specific flypage associated with it. Can someone please explain how the various columns are formatted on these browse pages?

Code prior to my modifications - this had everything overlapping -
<div style="width:100%;padding: 0px 3px 3px 3px;">
  <h2>
  <a style="font-size:16px; font-weight:bold;" href="{product_flypage}">{product_name}</a>
  </h2>
    <div style="float:left;width:32%" ><a href="{product_flypage}">
          <img src="{product_thumb_image}" {image_height} {image_width} border="0" alt="{product_name}" /></a>
    </div>
    <div style="float:left;width:60%">{product_s_desc}<br />
      <a href="{product_flypage}">[{product_details...}...]</a>
    </div>
  <br style="clear:both;" />
  <p>{product_price}</p>
  <div style="float:left;width:60%">
      {product_rating}
  </div>
  <div style="float:left;width:32%">{form_addtocart}
  </div>
  <br style="clear:both;" />
</div>


Code after my alterations which put everything into 2 neat columns:

<div style="width:100%;padding: 0px 3px 3px 3px;">
  <h2>
  <a style="font-size:16px; font-weight:bold;" href="{product_flypage}">{product_name}</a>
  </h2>
   
  <a href="{product_flypage}"> <img src="{product_thumb_image}" {image_height} {image_width} border="0" alt="{product_name}" /></a>
  <br>
  {product_s_desc}<br />
      <a href="{product_flypage}">[{product_details...}...]</a>
 
  <br style="clear:both;" />
  {product_price}<br>
  {product_rating} <br>
  {form_addtocart} <br style="clear:both;" />
  <br>
</div>

So again, how are the various columns formed from the code above?
Thanks for your help!

John