Post by Jansuh » Thu Jun 07, 2018 5:14 pm

Hi there,

Opencart 2.1.0.2, default template

I have added a small logo from my external review company in the header of my site.
I did this by changing my header.tpl file. Made the col-sm4 from the search bar a col-sm3 and added a col-sm1 at the end and put the logo in that.

Works like a charm for desktop and tablet view. I mobile view all the col-sm parts stack under each other and then this logo stands very ugly between the product bar and the menu.

Is there a way to not show this col-sm1 in mobile view with a css <span> or something?

I found this piece of code online, guess the answer is in there but cannot find it myself.

@media only screen and (max-width: 760px) {
[id="block-yui_3_17_2_15_1486677828083_6486"] {
display: none;
}
}

Thanks for your help.

New member

Posts

Joined
Fri Apr 20, 2018 8:13 pm


Post by Jansuh » Thu Jun 07, 2018 5:26 pm

Solved it.

Add the following to your stylesheet.css
@media screen and (max-width: 786px){.col-sm-1{display:none;}}

New member

Posts

Joined
Fri Apr 20, 2018 8:13 pm

Who is online

Users browsing this forum: No registered users and 36 guests