Community Forums › Forums › Archived Forums › Design Tips and Tricks › Soliloquy Slider and Metric Child Theme
- This topic has 1 reply, 2 voices, and was last updated 10 years ago by nutsandbolts.
-
AuthorPosts
-
April 26, 2014 at 3:32 pm #102509[email protected]Member
Hi all!
I'm attempting to use the Soliloquy Slider with the Metric Child Theme. I'm having one issue, the slider doesn't adapt to a smaller screen if I resize the browser window or even view it on my laptop. The images are 1905px wide and look fine on my widescreen but the image is simply cropped when viewing on a smaller screen. I've tried a number of sliders including wp-cycle and am having the same issue with all.
Here's what I have:
/***** Slider ********************/ #slider-bg { } #slider { width: 1905px; color: #FFFFFF; margin: 0 auto 0; padding: 0; overflow: hidden; } #slider a, #slider a:visited { color: #FFFFFF; text-decoration: none; } #slider a:hover { color: #FFFFFF; text-decoration: underline; } #slider .more-link { background: url(images/read-more.png); color: #FFFFFF; font-size: 14px; font-weight: bold; margin: 0; padding: 8px 15px 8px 15px; text-decoration: none; text-shadow: #436D04 1px 1px; -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; line-height: 42px; display: block; } #slider .more-link:hover { background: url(images/read-more-hover.png); text-decoration: none; } #slider p { margin: 0; padding: 0 0 10px 0; } #slider h2 { color: #FFFFFF; font-size: 26px; font-family: Arial, Tahoma, Verdana; font-weight: normal; margin: 0 0 10px 0; padding: 0; text-shadow: #002838 1px 1px; line-height: 30px; } #slider h2 a, #slider h2 a:visited { color: #FFFFFF; text-decoration: none; } #slider h2 a:hover { color: #72D4EA; text-decoration: none; } #slider .slider-right h4 { color: #FFFFFF; font-size: 20px; font-family: Arial, Tahoma, Verdana; font-weight: normal; margin: 0 0 10px 0; padding: 0 0 10px 0; text-shadow: #002838 1px 1px; border-bottom: 1px solid #72D4EA; } #slider ul { list-style-type: none; margin: 0; padding: 0 0 10px 0; } #slider ul li { margin: 0; padding: 0; } #slider .byline { margin: 0; padding: 0; } #slider .textwidget { margin: 0; padding: 0; } #slider li.widget_tag_cloud div { margin: 0; padding: 0 0 10px 0; } #slider .featuredpost .post, #slider .featuredpage .page { clear: both; } #slider .featuredpost, #slider .featuredpage { clear: both; } #slider .featuredpost img, #slider .featuredpage img { background: #FFFFFF; padding: 7px; border: 1px solid #BBBBBB; } .slider-left { background: #000000; width: 1905px; height: 460px; float: left; margin: 0; padding: 0; -moz-box-shadow: 0 5px 5px #333333; -webkit-box-shadow: 0 5px 5px #333333; } .slider-left .widget { padding: 0; }
Could someone please shed some light onto this for me?
http://www.thelordschild.orgApril 26, 2014 at 9:51 pm #102534nutsandboltsMemberIn your Soliloquy settings, is the slider set to be mobile responsive? If so, try turning that off since the theme isn't mobile responsive - that may be why it's acting funny. You might also try opening a support ticket with Soliloquy to have all the settings checked for compatibility.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+ -
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.