Disable Mobile Version - HTML question regarding tables

I guess this is a two part question... 1 part opencart 1 part html...

Is there a simple way to disable the mobile version of Opencart 2?

I'm having some visual issues that are giving me trouble. Honestly I would love to keep mobile support if I could figure out the below solution.

Essentially I have a picture that I want to take up 60% of the width of the site. I want the remaining width to contain a text area where:

a. the text fills up the whole area of the given space
b. the height of the area matches that of the picture.

With the below code, the text box wraps to many new lines and looks quite silly in the mobile version, but fits great on my PC.

If there was a way to tell the 2nd cell what height it had to be based on scaling of the picture and then tell the text to fill up that space, I think I would be golden. Any ideas???

you can add min-width, min-height to anything using CSS. as far as disabling the mobile page you'll have to go into the style sheet and find the @media callouts which tell the page what to do when the screen is a certain width and delete the appropriate ones.


as far as your code i think you'd be better off using divs and pulling them left and right as opposed to tables. then they can resize and move around pretty easily using the built in bootstrap stuff.

so one div will be width 60% with an image inside set to be responsive. and then next to it another div with some text that will change and fill up the remainder 40% regardless of size.

If you sent a link it would have been easier to find a fix.

deepvision wrote:If you sent a link it would have been easier to find a fix.

PM sent

I don't think you should use tables.
Better use two DIVs, one floated to the left with the width if 60% and another one with the width 40% floated to the right.
But for mobiles the float should be disabled with both DIVs taking 100% of width and positioned one under another.

Or you can leave html as it is but try the following trick.
Add a class to your table, for example "table" or whatever you like:
And then add the following css code to your theme stylesheet

Awesome, Thanks!

For the first solution, (seems the most elegant) how do I disable the float for mobile browsers?

Code?


Thanks!

wakerider017 wrote: For the first solution, (seems the most elegant) how do I disable the float for mobile browsers?

With the same media query :