Jump to content

Archived

This topic is now archived and is closed to further replies.

balfred1345

Framework 2.4.5 CSS Not Showing Up

Recommended Posts

balfred1345    5
balfred1345

I'm attempting to update a site using PL Framework 2.4.5, Basetheme, and WP 3.9.1

 

In Base Theme Global Setings / Custom Code / Custom CSS/LESS I've entered the following CSS:

#site .hentry ul #gift-amount {

  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
 
The custom CSS is not showing up as expected.
Please see the screenshot: http://screencast.com/t/ODfUOxlpoAyL
In the screenshot you'll see what I'm attempting to style, the html, and the Chrome Developer Tools.
As you can see in Chrome Developer Tools, my CSS is nowhere in sight. 
 
I've used the Flush LESS button, but it doesn't help.
 
The page I"m working on is:  http://seasonshospice.org/donate/
 
Please tell me what I need to do to get the CSS to take effect.
 
Thanks,
Bruce

Share this post


Link to post
Share on other sites
greenfly    230
greenfly

could you try 

 

#gift-amount .hentry ul {
  margin:0;
  padding:0;
   list-style:none;
}

The answer to many issues can be found by searching in the forum before posting as someone else  may very well have had the same problem before you have.  Also, reading the documentation can help you gain a good understanding of how everything works. 

 

Please do not send me private messages. Occam's razor - The principle states "Keep things simple!"

Share this post


Link to post
Share on other sites
balfred1345    5
balfred1345

Gave that a try, but it did not work.

 

As you saw in the screenshot w/ Chrome Dev Tools, it seems that my CSS is not being read by the browser. 

I'm used to seeing my CSS in Dev Tools or Firebug, even if it doesn't work for some reason. 

 

So, I don't know if the Flush Less is not working, or if there is something else going on.

 

Thoughts?

 

Thanks,

Bruce

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Hi Bruce,

 

The code didn't work, because it wasn't valid, use this instead.

 

#gift-amount {
list-style-type: none;
margin: 0;
padding: 0;
}
 
Also, you shouldn't use IDs to styling, you should always use classes instead. So replace your code with the following:
 
<ul class="gift-amount">
 
Then replace the CSS I gave you above with the following:
 
.gift-amount {
list-style-type: none;
margin: 0;
padding: 0;
}
  • Like 1

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
balfred1345    5
balfred1345

Danny,

Thanks so much! 

 

I was really beating my head agains the wall on this, for some reason. I think I'm so used to trying to be as specific as possible in my CSS, that I didn't think to use just the custom ID.

 

Question about ID vs. Class for styling

I'm styling a page that is mostly a javascript form that a developer provided me. I'm therefore hesitant to change IDs to Classes, since I'm assuming it might break the references in the javascript code.

If I leave the ID to use with styling, are there problems I should be aware of?

 

Thanks again! Always appreciate your assistance.

 

Best,

Bruce 

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

Well you're free to use whatever you like, but classes can be used on multiple elements and reused throughout your site. Whereas, elements can have only one ID and each page can have only one element with that ID.

 

In regards to CSS, there is nothing you can do with an ID that you can't do with a class, where as in your case (JavaScript) it does matter.

 

This is a good post - http://csswizardry.com/2011/09/when-using-ids-can-be-a-pain-in-the-class/


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
balfred1345    5
balfred1345

Thanks Danny!

 

Appreciate the link. It made me realize that I could add my own class in the html w/o  concern re breaking the javascript code. 

 

So I went ahead and put in the new class and took out my IDs in CSS.

 

Thanks again,

Bruce

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

No problem Bruce, happy to help.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

  • Similar Content

    • dougalperman
      By dougalperman+
      Hi there,
      I'm a big fan of Pagelines, and have been for years.
      I'm trying to control the size of video embeds and having some difficulty. I see that I can just paste the Vimeo video URL into the post and an embed widget will automatically appear, which is great. But the embed box created is much taller that the video (689 x 1000 pixels) so the content sits in the middle of a tall black box, which looks awkward.
      I tried using the full iFrame embed code from Vimeo, which solved the disproportionate embed frame size (or aspect ratio) issue, but despite specifying the dimensions I want (690 x 388), the videos displayed on the post are sized at 300 x 150 pixels.
      I can't work out how to change either.
      I'm using the latest version of Pagelines Framework (Pro) with the Agency them.
      Any help or advice very much appreciated.
      Thanks,
      Dougal
    • micstepl
      By micstepl+
      What is actually framework?
      - is ist that, what we used some years ago?
      - dös it replace DMS2?
      Usage
      - can I use framework beside of DMS2?
      - how do they relate?
    • almanada
      By almanada+
      2 year DMS Framework Dev Member here:
      Nothing is saving on our websites, our Key is no longer registering, emails have gone unanswered.  The DMS theme seems to be overall malfunctioning.   I just want it to work like it worked last week again please. Also, based on our your website is looking, it's also falling apart. Please Advise ASAP!  Our clients have a much shorter temper with us, because we actually offer a way to contact us.  We have reinstalled the latest theme over and over. 
    • oksodavid
      By oksodavid
      I can activate Framework 5.0.2 as stand alone theme ok. I get dashboard notice 'You need PageLines Connect' which is superseded by pl-platform - connect plugin.
      If I activate pl-platform 5.0.3, I get the 'total_pages' js error mentioned in pl-platform 5.0.2 plug and can't load Extend.
      I loaded PageLines Platform Developer 0.5.1, and dev loads ok.
    • OBXLynn
      By OBXLynn
      I hope someone can help me with this. I have added a GIF image to my Features - www.101thingsobx.com. The image contains changing copy. However, it doesn't seem to be working right. I have this same GIF on a different website (not WordPress-based - www.obx.com) and it is functioning correctly. Is there something I need to change in settings to allow the copy to work properly?
       
      Thank you for any help you can offer.
×