Title: Centering  with CSS for three elements
Last modified: August 21, 2016

---

# Centering with CSS for three elements

 *  Resolved [jbwhisler](https://wordpress.org/support/users/jbwhisler/)
 * (@jbwhisler)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/centering-with-css-for-three-elements/)
 * I have been trying so hard to figure this out and I can’t wrap my mind around
   the CSS. I just need 1 centered <div> container on the page with 3 containers
   inside of it. They each have a different width but all have the same margins 
   and need to be centered. Here is my website. The failed attempt is at the bottom
   using absolute positioning. I am running a child theme of twenty twelve. Can 
   anyone help please? Thank you.
 * [http://www.concordiabaptist.com/?page_id=9](http://www.concordiabaptist.com/?page_id=9)

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

 *  [Sleneau](https://wordpress.org/support/users/sleneau/)
 * (@sleneau)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/centering-with-css-for-three-elements/#post-4519372)
 * I’m totally right there with you. CSS is often a dragon to be slain. Here are
   a few suggested changes that accomplish what you’re looking to do. Update the
   existing styles in your style.css file with these to make the changes:
 *     ```
       .mmd1 {
       width: 100%;
       height: 175px;
       position: relative;
       margin: 0 auto;
       border: solid;
       }
   
       .mmd2 {
       width: 280px;
       height: 155px;
       display: inline;
       float: left;
       margin-left: 7px;
       margin-top: 7px;
       border: solid;
       background-position: left center;
       }
   
       .mmd3 {
       width: 400px;
       height: 155px;
       border: solid;
       background-position: center center;
       display: inline;
       float: left;
       margin-left: 8px;
       margin-top: 7px;
       }
   
       .mmd4 {
       width: 230px;
       height: 155px;
       border: solid;
       background-position: right center;
       display: inline;
       float: left;
       margin-left: 8px;
       margin-top: 7px;
       }
       ```
   
 *  Thread Starter [jbwhisler](https://wordpress.org/support/users/jbwhisler/)
 * (@jbwhisler)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/centering-with-css-for-three-elements/#post-4519470)
 * I learn so much here on these forums. Much appreciated man. Thank you.
 *  [Sleneau](https://wordpress.org/support/users/sleneau/)
 * (@sleneau)
 * [12 years, 4 months ago](https://wordpress.org/support/topic/centering-with-css-for-three-elements/#post-4519473)
 * Glad to help

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

The topic ‘Centering with CSS for three elements’ is closed to new replies.

## Tags

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

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 3 replies
 * 2 participants
 * Last reply from: [Sleneau](https://wordpress.org/support/users/sleneau/)
 * Last activity: [12 years, 4 months ago](https://wordpress.org/support/topic/centering-with-css-for-three-elements/#post-4519473)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics