We’re with you. JoomShaper is offering a 20% Discount on all plans due to the impact of COVID-19.

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Changes to responsive.less takes no effect

Featured Lock Resolved

I wanted to ask this question for a while now, changes I'm trying to do to the responsive.less file have no effect on the site.
They don't show up when I inspect the items as well.

And in the same matter, I've asked before but got no response, I would like to set the main slider to 100% width no matter the screen size instead of it being cropped at the sizes the way it is right now. I'm using SP Glamour (BTW, still no forum thread for this template).
Tried to add:
.sp-slider-item {
background-size: contain !important;

It worked but it messed up the sticky menu at the top.



6 Answers

Rifat Wahid Alif

More than a month ago #Permalink
did you compiled less file after save ? please compile after save and clear your site cache :)

- thanks

Guy Walder

More than a month ago #Permalink
Hello Rifat,

I didn't see any option to manually compile less files.
I've deleted my cache in the browser history and checked several other browsers as well.
In addition, I've checked to see the responsive.less file permission and it's good as well.
Tried to add !important after my line but no change as well.
Responsive.less is just ignored...

Any other ideas?


Rifat Wahid Alif

More than a month ago #Permalink
are you writing css from joomla admin or manually from IDE (eg. sublime, notepad ++ etc) ? if you write in manually then it should auto compiled and if you write from joomla admin you should compile from top menu.

if still you have problem please knock me in skype.

- Thanks

Guy Walder

More than a month ago #Permalink
Hi Rifat,

I'm accessing my files using FTP and edit them with Notepad++
This is actually not the first time I'm having trouble with responsive.less taking no effect.
What I did until today is copying the breaking points from responsive.less file to custom.less and adding the code there.
But I would like to stop and get more organized.

I'll try contacting you tomorrow. Thanks.

Rifat Wahid Alif

More than a month ago #Permalink

Guy Walder

More than a month ago #Permalink
To any one who might face this problem in the future, the responsive.less changes issue was solved by adding & before any additional change.
For example:
&.#sp-position1 {
height: 400px;

Main slider 100% width issue still not solved. I was suggested by Arun to add the following code:
@media only screen and (max-width: 767px)
.responsive section, .responsive header#sp-header-wrapper {
padding-left: 0;
padding-right: 0;
box-sizing: border-box;

Sadly it didn't work.
Link to the thread -> http://www.joomshaper.com/forums/smart-slider-cuts-images-in-responsive-mode

There are no replies made for this post yet.
Be one of the first to reply to this post!




Community Users


Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us