CiviCRM Community Forums (archive)

*

News:

Have a question about CiviCRM?
Get it answered quickly at the new
CiviCRM Stack Exchange Q+A site

This forum was archived on 25 November 2017. Learn more.
How to get involved.
What to do if you think you've found a bug.



  • CiviCRM Community Forums (archive) »
  • Old sections (read-only, deprecated) »
  • Support »
  • Installing CiviCRM »
  • WordPress Installations (Moderators: Kurund Jalmi, Coleman Watts) »
  • Finding css location
Pages: [1]

Author Topic: Finding css location  (Read 634 times)

biologyben

  • I post occasionally
  • **
  • Posts: 56
  • Karma: 2
  • CiviCRM version: 4.5.3
  • CMS version: Wordpress 4.0
Finding css location
October 17, 2014, 05:15:51 am
On my wordpress/civicrm public pages, the form labels print in white instead of black.  A problem when I have a white background.

I found via chrome inspect element that if I turn off the color: #fff line on this bit of css, it functions perfectly adequately.  Any idea where to find and change this that is update proof (for both wp & civicrm?

media="all"
.label {
display: inline;
padding: .2em .6em .3em;
font-size: 75%;
font-weight: 700;
line-height: 1;
color: #fff;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: .25em;
}

Dan C

  • I post frequently
  • ***
  • Posts: 179
  • Karma: 17
  • CiviCRM version: All
  • CMS version: Joomla 2.5 and 3.X, Drupal 7, Wordpress 3.7 and up
  • MySQL version: 5.1.7 and up
  • PHP version: 5.3.5 and up
Re: Finding css location
October 17, 2014, 07:01:05 am
When it comes to CSS changes I recommend you make the changes in your templates CSS file.  That is about as upgrade proof as you can make it.  I have had a similar problem on Joomla sites and the CSS files load in the correct order so that Joomla's template CSS will override Civi's.  I believe the same is true in Wordpress (although I haven't tried it).
CrusonWeb - Web Development, Implementation, and Support.  Specializing in CiviCRM and Joomla (although also knowledgable in Wordpress and Drupal as well).

haystack

  • I post occasionally
  • **
  • Posts: 61
  • Karma: 2
  • CiviCRM version: 4.n
  • CMS version: WordPress 4.n
  • MySQL version: 5.n
  • PHP version: 5.n
Re: Finding css location
October 17, 2014, 07:22:28 am
Unfortunately, that's not the case, @danc. Civi loads its head resources in via `wp_head`, with priority 10, whilst `wp_print_styles` happens earlier at priority 8.

 @biologyben you'll need to override Civi's CSS with more specific declarations of your own that target the same elements. So, in the example you gave, try something like:

body .label { color: #000; }

biologyben

  • I post occasionally
  • **
  • Posts: 56
  • Karma: 2
  • CiviCRM version: 4.5.3
  • CMS version: Wordpress 4.0
Re: Finding css location
October 17, 2014, 09:16:21 am
Quote from: haystack link=topic=34512.msg146570#msg146570

 @biologyben you'll need to override Civi's CSS with more specific declarations of your own that target the same elements. So, in the example you gave, try something like:

body .label { color: #000; }

Yes, but where? Dumb this down for me. In Wp or in civi - and what file specifically (if possible )

biologyben

  • I post occasionally
  • **
  • Posts: 56
  • Karma: 2
  • CiviCRM version: 4.5.3
  • CMS version: Wordpress 4.0
Re: Finding css location
November 17, 2014, 06:18:31 pm
Just for future - WEN's Social Links was the plugin that was breaking the drop-down search box.

I didn't even know it was active on this site as it was network activated on a multi-site installation. 

Also, the wordpress plugin 'Bootstrap Shortcodes' was breaking the label text on forms on end front.
« Last Edit: November 17, 2014, 07:20:29 pm by biologyben »

Pages: [1]
  • CiviCRM Community Forums (archive) »
  • Old sections (read-only, deprecated) »
  • Support »
  • Installing CiviCRM »
  • WordPress Installations (Moderators: Kurund Jalmi, Coleman Watts) »
  • Finding css location

This forum was archived on 2017-11-26.