CODEWITHSUNDEEP
htmlcssshopify
Alan DeLonga
Alan DeLonga

Reputation: 484

Modifying Shopify cartform height

So this is probably a stupid question but I have tried putting styling in everywhere and I can't get this to work, so here is my problem.

I made a shopping site using shopify, then to port it into our website we just used an iframe (since the rest of the site including header and footer is in wordpress). So we took off the scroll bars for the iframe and constrained it to the right height to have the home page and product page be displayed right in the middle of the page.

The problem is if you add a lot of items to the cart it gets larger then the iframe height and cuts off the checkout and paypal buttons...

I have modified the #cartform itself adding max-height: ... !important; no change... Then I modified the #cartform table adding max-height: ... !important; no change... Then went all the way up to the top div and added the same as above and all it did was move the background color up, but it didn't shrink the table.

The basic layout in html is:

   <div id="col-main" class="full content">
      <form id="cartform" class="clearfix" method="post" action="/cart">
         <table class="items">
            <colgroup></colgroup>
         </table>
      </form>
   </div>

I also was going in with firebug and changing the heights on all the different blocks containing the list of products. I even added style="" to the blocks them selves (shown above) and still nothing...

I was just wondering if anyone has tried to do this, ran into the same problem or can give me some insight as to what is going on and how to fix it. The only thing I can think of is that the list is being generated dynamically (adding each of the products in the cart in the table to be displayed). But I just don't understand why the table wouldn't be constrained by the height. Or how the entire table stays visible when the div that contains it is set with a smaller height.

Any help would be appreciated.

Thanks,

Alan

Upvotes: 0

Views: 208

Answers (2)

Thomas Holmes
Thomas Holmes

Reputation: 1

Alan, I might be a bit late with this for you but as an alternative, you can also embed your Shopify store in a wordpress site. Shopify have a free app to do it.

There's more info on that on the Shopify site.

Upvotes: 0

Alan DeLonga
Alan DeLonga

Reputation: 484

Stupid mistake... Wasn't adding "overflow: scroll" to the style as well. For some reason I thought auto was the default. But upon further review visible is the default...

Upvotes: 0

Related Questions