Title: CSS &amp; WordPress
Last modified: September 6, 2016

---

# CSS & WordPress

 *  [ant02](https://wordpress.org/support/users/ant02/)
 * (@ant02)
 * [9 years, 8 months ago](https://wordpress.org/support/topic/css-wordpress-2/)
 * Please can someone assist me in understanding how to use CSS in wordpress. I’m
   trying to add a contact widget into my pages [gautengelectricfencing.co.za](http://gautengelectricfencing.co.za)
   and am using it to learn CSS and also how to incorporate it into my websites.
 * Currently I coded the contact us in a table format without using CSS but have
   written a CSS script now and am unsure how to incorporate it into the site. The
   plugin which Im using to insert the widget into the page is “amr shortcode any
   widget” and works well for the table but not sure how to add the css. The support
   page recommends I change the style css file but what will happen when the template
   updates,will I have to recode the file again.
 * The code I’ve created below is what I want to incorporate into my site
 *     ```
       <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
       <html>
        <style type="text/css">
       img {
       	padding: 0.3em;
       }	
       div.box { border: solid; 
       	border-width: 5px; 
       	width: 280px; 
       	height: 150px;
       	background-color: #FFFF66;
       	border-color: #F00;
       	border-style: ridge;
       	float: right;
       	margin-left: 1em; 
   
       }
       A:hover { background: cyan }
       p { margin-top: 0.2em; margin-bottom: 0.2em; }
         </style>
       <head>
       </head>
   
       <body>
   
       <div class="box">
       <p><img class="alignnone wp-image-446 size-full" src="http://gautengelectricfencing.co.za/wp-content/uploads/2016/09/contactusNow.png" alt="contactusNow" width="200" height="45" />
         </p>
       <p><img class="alignnone size-full wp-image-294" src="http://gautengelectricfencing.co.za/wp-content/uploads/2016/09/phone-icon.png" alt="phone-icon" width="12" height="12" /><a href="tel:+27824103401">0824103401</a>  </p>
       <p><img class="alignnone size-full wp-image-295" src="http://gautengelectricfencing.co.za/wp-content/uploads/2016/09/mail-icon.png" alt="mail-icon" width="15" height="12" /><a href="mailto:info@gautengelectricfencing.co.za">info@gautengelectricfencing.co.za</a></p>
       <p>&nbsp;</p>
       </div>
       </body>
       </html>
       ```
   
 * Please advise what I should add and where I should put the CSS file. I created
   a test post [http://gautengelectricfencing.co.za/beware/ ](http://gautengelectricfencing.co.za/beware/)
   but as ypu can see its not great
 * Any help willbe appreciated, Thanks

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

 *  [ThemeSumo](https://wordpress.org/support/users/themesumo/)
 * (@themesumo)
 * [9 years, 8 months ago](https://wordpress.org/support/topic/css-wordpress-2/#post-8171598)
 * Yes, if you modify the themes style.css, or any other theme file for that matter,
   you will need to keep re-adding your modifications after each theme update because
   they will be overwritten.
 * This is where [Child Themes](https://codex.wordpress.org/Child_Themes) come in
   handy as they allow you to safely modify any area of the theme without ever overwriting
   your custom changes when you update in the future.
 * Hope this helps.
 *  Thread Starter [ant02](https://wordpress.org/support/users/ant02/)
 * (@ant02)
 * [9 years, 8 months ago](https://wordpress.org/support/topic/css-wordpress-2/#post-8174993)
 * Thank you for the feedback, I’m going to use the CSS plugin and later experiment
   with using a child theme

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

The topic ‘CSS & WordPress’ is closed to new replies.

## Tags

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

 * 2 replies
 * 2 participants
 * Last reply from: [ant02](https://wordpress.org/support/users/ant02/)
 * Last activity: [9 years, 8 months ago](https://wordpress.org/support/topic/css-wordpress-2/#post-8174993)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics
