- This topic has 11 replies, 3 voices, and was last updated 10 years, 1 month ago by Sakin.
-
AuthorPosts
-
July 17, 2013 at 2:06 am #11939cbtoolkitMember
I’m trying to figure out the css to make my full-width featured slider have no margin or padding. I want the image to be as large as the entire main area left to right.
I can remove the margin and almost get it but have not figured out how to get rid of the grey margin around the #slider.
I’ll look at it again tonight but if anyone has an idea, let me know.
Thanks.
July 17, 2013 at 3:57 pm #11974SakinKeymaster@cbtoolkit: Can I take a look at your site?
July 17, 2013 at 5:41 pm #11988cbtoolkitMember@Sakin,
Here is my demo site..
http://demo.kreativeknowledge.com/I’ll be doing the same for this site.
http://www.PulseInfomatics.comJuly 17, 2013 at 5:46 pm #11989cbtoolkitMemberHere is what I came up with…
#slider.slider-fullwidth { margin: 0px; } #slider-wrap a { padding: 0; }
July 17, 2013 at 6:00 pm #11990cbtoolkitMemberI added a 0 bottom margin for #main on the demo site.
However, on the PulseInfomatics.com site, I still get a left and right dark gray edge that I do not want. I’ll leave it for now so you can check it.
http://www.PulseInfomatics.comJuly 17, 2013 at 6:35 pm #11993cbtoolkitMemberI also attempted to set the margin below the main menu at pulse to “0 auto 0”.
It works when I am modifying the element in chrome in real-time but when I save that into the custom CSS it doesn’t alter it.
#access { margin: 0 auto 0; }
Basically, making the image full-width, no space between main-menu at the top, no gray background/border on the image at all.
Thanks.
July 17, 2013 at 10:33 pm #12001SakinKeymaster@cbtoolkit: In our site http://www.pulseinfomatics.com/ the images in the slider width is 980px whereas the site width is 1000px. So, just increase the width of the images.This will remove the grey background in left and right.
To remove the margin between the menu and slider, you need to add the following css.
#branding #access { margin-bottom: 0; }
July 18, 2013 at 12:36 am #12015cbtoolkitMemberAwesome! I thought that might be it..
I’ll check it out later.
July 28, 2014 at 9:48 pm #41558Dirk R.Member@cbtoolkit + @Sakin
How did you create the full width slider on the home page? (please note, i’m a novice)
Our page: http://www.sleepapneasurgicure.com
Thank you!
DRHJuly 29, 2014 at 12:18 am #41569SakinKeymasterHello DRH,
I just check in your slider and see that you are using Featured Post Slide in “Catch Kathmandu Pro theme”. But the image size added as featured image in those posts are small. Your featured image width is just 661px width. But the size needed is 1280px width. So, you need to edit those post and upload the larger featured image.
See the tutorial:
Adding Featured Image: http://catchthemes.com/blog/videos-blog/video-series-adding-featured-image-wordpress-postpage/
Adding Featured Post Slider: http://catchthemes.com/blog/videos-blog/video-series-adding-featured-post-slider/
Adding Featured Image Slider: http://catchthemes.com/blog/videos-blog/video-series-adding-featured-image-slider/
Theme Instruction page: http://catchthemes.com/theme-instructions/catch-kathmandu-pro/Regards,
SakinJuly 29, 2014 at 4:28 am #41579Dirk R.MemberThank you, Sakin. This a a great template – I’m pleased to use it. I hope our efforts do your theme some justice. I’m very new at this, so it’s all coming very slow. I really like how @cbtoolkit got the edge to edge slider and round icons…great look.
Take care for now and thank you for responding!
DRHJuly 29, 2014 at 9:32 am #41587SakinKeymasterHello DRH,
If you want to use Full Width Slider, then you can use Adventurous Pro theme http://catchthemes.com/themes/adventurous-pro/. See the demo http://catchthemes.com/demo/adventurous/
Regards,
Sakin -
AuthorPosts
- The topic ‘Full-width featured slider’ is closed to new replies.