Tagged: max-width, responsive, theme-options
-
AuthorPosts
-
September 10, 2014 at 11:52 pm #317027
Hello,
I’m having trouble with the larger max-width view. Looking at FireBug, it seems to be stuck on the 1030px setting, despite having switched to 1210px and purging my cache.
Any ideas?
Thanks,
DavidSeptember 11, 2014 at 2:21 am #317100Hi David,
Can you post the link to your website please?
Regards,
JosueSeptember 12, 2014 at 9:19 am #317965Hi Josue,
Please check your gmail account – I sent you a response there with all the details for logging in. We gave you an admin account and the IP address for the hosts entry needed to view the site in development.
Thanks,
DavidSeptember 12, 2014 at 9:24 am #317969I was able to add some quick CSS to simulate the Theme Option, but now I’m having trouble with the mega menu showing off screen to the right and not centering. I tried using both percentages and pixels for the value of the container width:
.responsive .container, .responsive .container .twelve.units {width: 1210px;}
and
.responsive .container, .responsive .container .twelve.units {width: 96%;}
And I played with the responsive values using media queries. But I wish I wasn’t hacking this by adding quick CSS when the Theme Option for 1210px should be working. To test further, I tried installing the theme locally in MAMP and I’m having the same issue with the larger 1210px not activating. :/
Thanks,
DaveSeptember 12, 2014 at 9:44 am #317973Just curious, but as a quick CSS fix, is there a set of CSS selectors to copy from the working theme with the 1210px max-width Theme Options? Preferably with accompanying media queries?
September 12, 2014 at 7:34 pm #318291Hey!
You’d be able to set a custom container width in Enfold 3.0, in the meantime, i’d suggest recompiling the css/grid.less file to match your requirements, you can use this online compiler for that:
http://lesstester.com/Just change the @maxWidth values, compile it and copy the resulting content (right) to the css/grid.css file.
Regards,
JosueSeptember 12, 2014 at 11:22 pm #318353Thanks, Josue, when will 3.0 be released?
I’m trying your method and I’m not sure if I’m doing this correctly. Basically, I want the site content columns to stretch and flex within its container that’s 96% of the browser width (same as the stretched header option we have enabled).
But the generated CSS from that lesstester.com is giving me a -4% value for the
container
width. This is what I changed in the LESS before compiling.@maxWidth:96%; //default width //working: 990px&30 - 1010px & 50 @maxWidthLarge:96%; //large //working: 1110px&30 - 1130px & 50 @maxWidthExtraLarge: 96%; //extra large // @maxWidthTablet:96%; //tablet size //working: 774px&30 - 782px & 50 @maxWidthMobileLarge:96%; //mobile landscape //working: 478px&30 - @maxWidthMobileSmall:96%; //mobile portrait //working: 318px&30 -
Will percentages not work? Or am I editing this incorrectly?
Thanks for your patience and help!
September 13, 2014 at 1:33 am #318371Hey!
Try adding this to the Quick CSS instead:
.avia-section .container { width: 100%; }
Best regards,
JosueSeptember 13, 2014 at 3:31 am #318410Thanks, but that didn’t do anything. :/
September 13, 2014 at 7:25 am #318421Hey!
Can you post a screenshot/mockup of what would you want to achieve?
Best regards,
Josue -
AuthorPosts
- You must be logged in to reply to this topic.