Community Forums › Forums › Archived Forums › General Discussion › Streamline Pro new Widget CSS
Tagged: css, streamline pro
- This topic has 6 replies, 3 voices, and was last updated 10 years, 10 months ago by
SimplyAA.
-
AuthorPosts
-
March 13, 2014 at 3:53 pm #94770
SimplyAA
MemberI 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
March 14, 2014 at 1:24 am #94816Au Coeur
MemberUse #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 #94885SimplyAA
MemberI 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 #95319Tom
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; }
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 #95957SimplyAA
MemberThanks 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 #95961Tom
ParticipantYou'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 #95963SimplyAA
MemberYes! Success! Thank you so much. I thought I was going crazy.
Thanks again Tom.
Angela
-
AuthorPosts
- The topic ‘Streamline Pro new Widget CSS’ is closed to new replies.