• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

CSS homepage help with slider

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › CSS homepage help with slider

This topic is: resolved

Tagged: slider

  • This topic has 5 replies, 2 voices, and was last updated 10 years, 4 months ago by bwboykin.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • January 17, 2013 at 5:25 pm #12747
    theand
    Member

    Hi any CSS Superheros out there willing to help a damsel in distress?
    I have a couple of questions. Please see the site I've listed in regards to these questions. I am using Google Chrome to build the site.
    >>> http://designdr.com.au/christies/
    A) The featured slider area: There is a white bar appearing above the 3 images I have uploaded to that area. How do I get rid of this white bar?
    B) Just to the top left of the feature slider area is a small black circle. How did this appear there and how do I remove it?
    C) In the 'Latest News' section in the bottom right of the homepage: how do I add some padding underneath each of the [Read More...] lines so there is a bit of separation between the end of each post and the title of the next post?
    Thanks very much,
    Andrew

    January 17, 2013 at 10:00 pm #12795
    theand
    Member

    I worked out that for problem A) and problem B) that when I set the responsive slider to 'Fade' transition the problems occur and when I set it to 'Slide' transition the problems disappear!

    I need it to be on 'Fade' though.

    January 17, 2013 at 10:57 pm #12799
    theand
    Member

    Anyone?

    January 17, 2013 at 11:01 pm #12800
    theand
    Member

    For my question C) I found in the CSS file this code:

    .home h2 {
    margin: 0 0 5px;
    }

    Then I can add spacing by adding padding like this:

    .home h2 {
    margin: 0 0 5px;
    padding-top: 5xp;
    }

    Except then the 1st post moves down out of alignment also. How do I add padding to just the 2nd and 3rd posts on the homepage and not the first?

    January 20, 2013 at 8:37 pm #13384
    theand
    Member

    Found help from elsewhere on the web. Incase any other people are interested here is the solutions:

     

     

    To fix A & B, open your style.css file goto line 137 and look for

    Code:
    ul li {
    list-style-type: circle;
    /*list-style-image: url('sqpurple.gif');*/
    }

    and change to

    Code:
    ul li {
    list-style-type: none;
    /*list-style-image: url('sqpurple.gif');*/
    }

    To fix C, same file (style.css) goto line 1333 and look for

    Code:
    .featuredpage .page,
    .featuredpost .post {
    overflow: hidden;
    margin: 0;
    padding: 0;
    }

    and change to

    Code:
    .featuredpage .page,
    .featuredpost .post {
    overflow: hidden;
    margin: 0;
    padding: 0;
    margin-bottom:20px;
    }

    you can change the 20px to whatever you decide.

    January 20, 2013 at 8:45 pm #13390
    bwboykin
    Member

    Glad you figured it out. I was just about to log in and post where in style.css that can be found.

    A great tool if you're a Firefox user is Firebug. It is very helpful in drilling down what different elements are named and how they are styled. If you're a Chrome user they have something similar as well. Either can save you much, much time.

    Cheers!

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘CSS homepage help with slider’ is closed to new replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble