• 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

Streamline Pro new Widget CSS

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 › General Discussion › Streamline Pro new Widget CSS

This topic is: resolved

Tagged: css, streamline pro

  • This topic has 6 replies, 3 voices, and was last updated 11 years, 1 month ago by SimplyAA.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • March 13, 2014 at 3:53 pm #94770
    SimplyAA
    Member

    I have created a new widget here http://freespiritwebsites.com/lg/ titled "What Our Clients Are Saying...". I want to add CSS such as padding, background color, etc. I know this is probably really simple but I am doing something wrong as the CSS I've used isn't linking to it for some reason. I have:

    .testimonials {	
    	background-color: red;
    	word-wrap: break-word;
    	display: block;
    	text-align: left;
    	color: #444444;
        font-family: 'PT Sans',sans-serif;
        font-size: 1.6rem;
        font-weight: 400;
        line-height: 1.625;
        }
    
    .testimonials widget-wrap {
    	padding: 64px 0;
    	padding: 4rem 0;
    }
    

    Angela

    http://freespiritwebsites.com/lg/
    March 14, 2014 at 1:24 am #94816
    Au Coeur
    Member

    Use #testimonials instead of .testimonials.


    Mother. Web & Graphic Designer. Lactation Consultant. Blogging about how it all fits together, most recently from northern Colorado. Visit my blog or my design site.

    March 14, 2014 at 12:32 pm #94885
    SimplyAA
    Member

    I did but it still doesn't work. It won't acknowledge any of the CSS I used. I read somewhere about that I have to use the i selector id and I tried that but still couldn't get it to work. This is what Firebug shows right now:

    <div class="wrap">
    <section id="text-2" class="widget widget_text">
    <div class="widget-wrap">

    Angela

    March 17, 2014 at 10:39 am #95319
    Tom
    Participant

    @AuCoeur is spot-on. Just change your CSS selector to grab the testimonials id (#testimonials) instead of trying to use the class (.testimonials).

    #testimonials {	
    	background-color: red;
    	word-wrap: break-word;
    	display: block;
    	text-align: left;
    	color: #444444;
        font-family: 'PT Sans',sans-serif;
        font-size: 1.6rem;
        font-weight: 400;
        line-height: 1.625;
        }
    
    #testimonials .widget-wrap {
    	padding: 64px 20px;
    	padding: 4rem 2rem;
    }

    freespiritwebsites screenshot

    Either that or change your HTML to declare class=testimonials and use the appropriate CSS for .testimonials.


    Choose your next site design from over 350 Genesis themes.
    [ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

    March 21, 2014 at 9:59 am #95957
    SimplyAA
    Member

    Thanks for responding. This is really strange and I feel like I'm missing something simple.... I changed it to #testimonials. I made the background red so it would stand out. Now, the red background shows up on the smaller size screens but not full screen when I check it out at: http://www.studiopress.com/responsive/. (www.freespiritwebsites/lg)

    What am I missing?


    Angela

    March 21, 2014 at 10:43 am #95961
    Tom
    Participant

    You've placed the #testimonials snippet inside an open media query for 767px, beginning at line 2147 of your style.css.

    You should reposition the snippet to the main section of the stylesheet and close the media query as necessary. Watch out for #homesignup.

    (Don't forget to take out the background-color: red; highlight.)


    Choose your next site design from over 350 Genesis themes.
    [ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

    March 21, 2014 at 11:13 am #95963
    SimplyAA
    Member

    Yes! Success! Thank you so much. I thought I was going crazy.

    Thanks again Tom.


    Angela

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Streamline Pro new Widget CSS’ 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

© 2025 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