Title: Button CSS
Last modified: August 30, 2016

---

# Button CSS

 *  [ruby06dawnbrooke](https://wordpress.org/support/users/ruby06dawnbrooke/)
 * (@ruby06dawnbrooke)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/button-css-2/)
 * Hello!
 * I use the Sketch theme and I was wondering if there was any button CSS for it,
   thanks!

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Moderator [Kathryn Presner](https://wordpress.org/support/users/zoonini/)
 * (@zoonini)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/button-css-2/#post-6515336)
 * If you’re trying to add a link that looks like a button, Sketch doesn’t come 
   with any premade styles, so you’ll need to add your own via CSS.
 * Otherwise, you can use the **button** element – those are pre-styled to match
   Sketch’s look and feel.
 * If you go the CSS route, don’t edit the theme files directly, otherwise your 
   changes will be overwritten every time the theme is updated to the latest version.
 * An easy way to add custom CSS is to install the [Jetpack plugin](http://jetpack.me/)
   and activate the [Custom CSS](http://jetpack.me/support/custom-css/) module. 
   You’ll then add your custom CSS in the new stylesheet editor that’ll appear in
   your dashboard, under Appearance > Edit CSS.
 * As alternatives, you could either install a [standalone custom CSS plugin,](http://wordpress.org/plugins/search.php?q=custom+css)
   or create a [child theme.](http://codex.wordpress.org/Child_Themes)
 *  [nanoanno](https://wordpress.org/support/users/nanoanno/)
 * (@nanoanno)
 * [10 years, 8 months ago](https://wordpress.org/support/topic/button-css-2/#post-6515355)
 * Hey Kathryn!
 * I have the same question as above… Can you explain what you mean by the button
   element?
 * I have tried using this button shortcode:
 * `[button align="center" color="white" size="small" link="urlhere"]Button Text
   Here[/button]`
 * But I’m not getting anything to work on the site.
 *  [sacredpath](https://wordpress.org/support/users/sacredpath/)
 * (@sacredpath)
 * Automattic Happiness Engineer
 * [10 years, 8 months ago](https://wordpress.org/support/topic/button-css-2/#post-6515373)
 * What [@kathryn](https://wordpress.org/support/users/kathryn/) was saying is to
   use the “button” HTML. This is an example that you can use as a guide. The styling
   would be the default styling of the button element for the theme, or if the theme
   doesn’t have styling for that element, then what the browser decides.
 *     ```
       <button>Click Me!</button>
       ```
   
 * If you wish to add your own styling to that button, then you would need to add
   a CSS class or an id to that code, such as this.
 *     ```
       <button type="my-button">Click Me!</button>
       ```
   
 * The above would be placed into the page or post content and then you would have
   to create a CSS rule to style it as you see fit, such as the below example.
 *     ```
       .my-button {
           background-color: #cc0000;
           color: #000;
           border: 1px solid #000;
           border-radius: 5px;
           padding: 20px;
       }
       ```
   

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Button CSS’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/sketch/1.2.4/screenshot.png)
 * Sketch
 * [Support Threads](https://wordpress.org/support/theme/sketch/)
 * [Active Topics](https://wordpress.org/support/theme/sketch/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/sketch/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/sketch/reviews/)

 * 3 replies
 * 4 participants
 * Last reply from: [sacredpath](https://wordpress.org/support/users/sacredpath/)
 * Last activity: [10 years, 8 months ago](https://wordpress.org/support/topic/button-css-2/#post-6515373)
 * Status: not resolved