0
votes

I am new to Wordpress and CSS. I have recently purchased a wordpress theme

I have created a website and I want to change the color of some elements in the website. So for instance, under the menu item "The Opportunity", there is a picture that says "Potential of the EMC customer" The line under that is in grey and is barely readable.

So I want to change the color. The theme Options allow me to use custom CSS..

enter image description here

The code I am using is:

media="all"
.white-overlay p {
padding: 5px 0 15px;
font-size: 15px;
color: #a81800;
}

When I try to add the code to stle.css under wp-content/themes/vernum (I am accessing this file using FTP), I see this:

/* Theme Name: Vernum - Responsive One Page Parallax Template Theme URI: http://spyropress.com/themes/vernum Author: Spyropress Author URI: http://spyropress.com/ Description: Vernum is a project of the spring, joyful one page website. It is modern and clean, very easy to edit. It's prepared to use with jquery parallax efect. There are flat and simple graphics. It's multipurpose, so you can use it as portfolio, or personal page, whatever you want … Version: 1.8.2 License: WordPress theme is comprised of two parts: (1) The PHP code is licensed under the GPL license as is WordPress itself. You will find a copy of the license text in the same directory as this text file. Or you can read it here: http://codex.wordpress.org/GPL (2) All other parts of the theme including, but not limited to the CSS code, images, and design are licensed according to the license purchased. Read about licensing details here:

http://wiki.envato.com/support/legal-terms/licensing-terms/
License URI: license.txt
Tags: agency, clean, easy to use, flat, minimal, modern, multipurpose, one page, parallax, portfolio, responsive, retina, simple, spring, spyropress, builder
Text Domain: spyropress
*/


.wp-caption { }
.wp-caption-text { }
.sticky { }
.gallery-caption { }
.bypostauthor { }
.alignright { }
.aligncenter { }
.alignleft { }

So I am not sure where exactly should I add the code But it does not change the color! Would anyone help e investigate..I've been struggling with it for hours :(

3
Just delete media="all" part (first line of your custom css) and it should work.nd_macias
Why have you got media="all" in there.Nick R

3 Answers

0
votes

You don't need media="all" here, so just remove it:

.white-overlay p {
    padding: 5px 0 15px;
    font-size: 15px;
    color: #a81800;
}
0
votes

If all you want to do is change the colour of the text underneath then just insert the following in your custom css:

.white-overlay p {
    color: #a81800;
}

This will leave all the other properties (font size and padding) as they were originally specified in the main CSS file. You shouldn't put media="all" in the CSS because:

  • It's redundant; the browser will assume that a rule applies to all media types unless told otherwise.
  • The syntax is actually formatted like this:

    @media [media type] { [selector] { [property]: [value]; }

If you wanted to make the transparent overlay a little less transparent you could also add the following code:

.white-overlay {
    background: rgba(255, 255, 255, 0.6);
}

The final number in the background value specifies the opacity (from 0 to 1) and has been changed by me from 0.5 to 0.6.

-1
votes

I have experienced the same problem with the Vernum Wordpress theme. For some reason (which I cannot understand) they style.css is not 'correctly' linked. I solved the issue by adding a copy of the header.php of the parent theme inside the child theme folder, and adding the following line:

<head>
    <?php wp_head(); ?>
   <link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css"     media="screen" />

</head>

This seems to give correct visibility to the style.css, so that it can be overridden by the child theme. Note that I am currently experiencing other problems with the Vernum theme, concerning the use of multiple stylesheet, so it seems to be not the ideal theme to try and re-style.

good luck Giovanni