Title: modifying the CSS
Last modified: August 30, 2016

---

# modifying the CSS

 *  [jessy5000](https://wordpress.org/support/users/jessy5000/)
 * (@jessy5000)
 * [10 years, 7 months ago](https://wordpress.org/support/topic/modifying-the-css/)
 * Hi
    i have created a menu in the body of my page using ‘Shortcodes Ultimate’ 
   I want to make changes such as color of text etc.to this menu using CSS.
 * I have tried to copy some rules relating to color of text and pasting them into
   my style sheet but this is having no effect.
 * Maybe you can direct me in this.
    Here is the link to my site: [http://colmohara.ie/wordpress/?page_id=6](http://colmohara.ie/wordpress/?page_id=6)
   Thanks Jessy5000
 * [https://wordpress.org/plugins/shortcodes-ultimate/](https://wordpress.org/plugins/shortcodes-ultimate/)

Viewing 1 replies (of 1 total)

 *  [kinna28](https://wordpress.org/support/users/kinna28/)
 * (@kinna28)
 * [10 years, 6 months ago](https://wordpress.org/support/topic/modifying-the-css/#post-6743254)
 * You can add the styles you want to the custom CSS box in the plugin settings.
   The best way to do this is to specify a new class for your custom version, and
   place that in the Class box (or add class=”class-name” to your shortcode in the
   editor). Then you can call to just that custom type.
 * Here’s an example:
    **On your page:** `[su_heading class="su-heading-green"]This
   is a header with green text[/su_heading]` **In your Shortcodes Ultimate settings
   > Custom CSS tab:**
 *     ```
       .su-heading-green {
       	border-top: 1px solid #0d5412;
       	border-bottom: 1px solid #0d5412;
       	color: #33662e;
       	font-weight: bold;
       }
       .su-heading-green.su-heading-inner {
       	border-top: 4px solid #538256;
       	border-bottom: 4px solid #538256;
       }
       ```
   
 * Notice that I handled two elements, which is because the shortcode creates:
 *     ```
       <div class="su-heading su-heading-style-default su-heading-align-center su-heading-green" style="font-size:13px;margin-bottom:20px">
       <div class="su-heading-inner">This is a header with green text</div>
       </div>
       ```
   
 * The double lines were created by a top/bottom border on both the main element
   and the inner element, so I accounted for both…and made the font bold just because.

Viewing 1 replies (of 1 total)

The topic ‘modifying the CSS’ is closed to new replies.

 * ![](https://ps.w.org/shortcodes-ultimate/assets/icon-256x256.gif?rev=2547563)
 * [Shortcodes Ultimate - Content Elements](https://wordpress.org/plugins/shortcodes-ultimate/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/shortcodes-ultimate/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/shortcodes-ultimate/)
 * [Active Topics](https://wordpress.org/support/plugin/shortcodes-ultimate/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/shortcodes-ultimate/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/shortcodes-ultimate/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [menu](https://wordpress.org/support/topic-tag/menu/)
 * [rules](https://wordpress.org/support/topic-tag/rules/)

 * 1 reply
 * 2 participants
 * Last reply from: [kinna28](https://wordpress.org/support/users/kinna28/)
 * Last activity: [10 years, 6 months ago](https://wordpress.org/support/topic/modifying-the-css/#post-6743254)
 * Status: not resolved