Post by thomash2 » Mon Dec 12, 2016 10:38 am

Hi, I'm using this Responsive Design - Default Original Theme for 1.5.X to learn how to make my site responsive, and I got the front and info pages responsive, using max-width and width=100% on the containers and boxes, along with the @media to collapse or hide the top menu bar.

But I can't get the product-info DIV to be internally responsive between the left and right.
Could someone give me a hint?

So inside product-info is a left and right DIV. Left has product-image and -additional-image, while the right side contains the price, option carts.

I want t he right side fixed width at 320px and the left side to fill in the rest of the space. I set product image to max-width:100%; height:auto; so the image should fill in the left DIV. I also removed the float-left from the nested DIVs in the left side.

But I can't seem to find a way to do get the left DIV to fill in the empty screen space. I could only get the left side to be fixed (then downsize with @media when browser is scaled down), or use a width percentage, with either both left and right DIVs floating, or right side floating and left side inline-block. But either method does not completely fill in the empty space.

Any ideas or examples someone could show me?
Thanks

New member

Posts

Joined
Tue Jul 30, 2013 12:44 am

Post by IP_CAM » Mon Dec 12, 2016 11:16 am

just to be honest with you, you won't get far, by trying to play around with this, and before you'll end up in plain frustration, better read here first. I played around with this Theme, without getting anywhere, visually at least.
---
making the default template responsive
viewtopic.php?f=20&t=171014&p=649645#p648622
---
Everything, below the 'standard' of this Theme, should not longer be considered, because, to make a Shop look good in all Resolutions, the 'Rules and Standards' of Bootstrap must apply, and this is fully the Case, when changing to this one. I am exited about, how easy it can be handled, and fine tuned, whereever required eventually, to match individual Designs. Can be seen here in Action, momentarely:
http://www.hitline.info/
---
OC Bootstrap - Opencart Bootstrap 3 Theme - Front End
https://www.opencart.com/index.php?rout ... n_id=14631
Image
Just to have it said! Good Luck ;)
Ernie
bootstrap_3_free_theme.jpg

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland
Who is online

Users browsing this forum: No registered users and 90 guests