SOLVED Media Query 960 - 1199 stopped
-
-
- gruvhip
- Jr. Rocketeer
- Posts: 49
- Thanks: 0
-
I am completely baffled and need help. I am using Joomla 3.3 and the latest gantry and gantry theme. I am fairly deep in to designing this site. All of a sudden it stopped reading the desktop min-width:960 to max-width:1199 style queries from my template-custom.less file. I have studied the css in the file carefully, cleared every cache, traced back everything I have done since I know it was still working and I still can't get it to work. Other query sizes seem to work fine. The site is beta.suncoastbbqbash.com. One place you can see it not working is under the home page rotator where it says Venice Municipal Airport A Finger Lickin' - Hot Pickin' Good Time! Free Admission & Parking. Any help greatly greatly apprciated.
Thank You
Ken
-
-
-
- prim
- Preeminent Rocketeer
- Posts: 17290
- Thanks: 217
- Hmm, i cannot see any custom CSS file on your site?
- Please reply with a direct link to the issue & create a new thread for each new issue.
A template is only as good as the content that goes into it
- DanG
-
-
-
- prim
- Preeminent Rocketeer
- Posts: 17290
- Thanks: 217
- Ok, so have you tried running off all cache (including APC or OPcache on the server), css-compression, rokbooster or similar ones?
- Please reply with a direct link to the issue & create a new thread for each new issue.
A template is only as good as the content that goes into it - DanG
-
-
-
- gruvhip
- Jr. Rocketeer
- Posts: 49
- Thanks: 0
-
Well I don't know anything about an APC or OPcache on the server. But I have cleared to cache in the system config area, on the template, all plug ins and modules. I do not have rokbooster enabled. I have the css compression off on the Less complier in the template admin area. I am really stumped on why it is just not reading that size on any page. I appreciate your help. I haven't changed the less file for that media query. If it helps, here is what I have in the custom-template.less file;
@media only screen and (min-width: 960px) and (max-width: 1199px) {
.sprocket-headlines-text img {max-width:108px!important;}
#rt-header {font-size:21px;}
#favpromote-title {font-size:15px !important;}
.qualifier img {width: 100px;}
.sanction img {width: 30%;}
.qualifier-logo img {width:100px;}
}
-
-
-
- prim
- Preeminent Rocketeer
- Posts: 17290
- Thanks: 217
-
Ok, can you turn of the rotation of the images for a while? It'll make it easier to debug
- Please reply with a direct link to the issue & create a new thread for each new issue.
A template is only as good as the content that goes into it - DanG
-
-
-
- prim
- Preeminent Rocketeer
- Posts: 17290
- Thanks: 217
-
Try putting this code in your custom css file (NOT in your LESS file)
@media (min-width: 960px) and (max-width: 1199px) {
.sprocket-headlines-text img {
max-width: 114px !important;
}
}
I hope this works because it worked fine in my browser. - Please reply with a direct link to the issue & create a new thread for each new issue.
A template is only as good as the content that goes into it - DanG
-
-
-
- prim
- Preeminent Rocketeer
- Posts: 17290
- Thanks: 217
-
Since you are using the default Gantry template then it should be named gantry-custom.css
You can read more here: www.gantry-framework.org/documentation/j...custom_stylesheet.md
Don't forget to clear the Gantry cache when you're done. - Please reply with a direct link to the issue & create a new thread for each new issue.
A template is only as good as the content that goes into it - DanG
-
Time to create page: 0.069 seconds