Title: Making a map full width
Last modified: August 30, 2016

---

# Making a map full width

 *  Resolved [Shutterbabe86](https://wordpress.org/support/users/shutterbabe86/)
 * (@shutterbabe86)
 * [10 years, 11 months ago](https://wordpress.org/support/topic/making-a-map-full-width/)
 * I’m trying to get my site up and going and having a little trouble with a few
   customization’s. At the moment I’m having issues trying to make the Site Origin
   Map I have on my Contact page full width. I can make it full width stretched,
   but then it stretches over the entire page and looks kinda funky. I just want
   it full width to the width of the white area.
 * I already read a post about how to do this with an image (writing full-width 
   under the advanced setting of the image, etc) and was able to successfully do
   this to the front page (though there is still a weird small white area on the
   far right of the front image), but this doesn’t work for the map I’m trying to
   use. Here’s the link to the page: [http://shutterbugpub.com/contact-us/](http://shutterbugpub.com/contact-us/)
 * Any help is much appreciated, thank you!

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

 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [10 years, 11 months ago](https://wordpress.org/support/topic/making-a-map-full-width/#post-6291216)
 * Thanks for using Tracks!
 * For making any element in a post the full-width of the container, first add the
   following CSS to your child theme’s style.css file, or to the Custom CSS section
   in the Customizer:
 *     ```
       .entry-content .full-width {
       	position: relative;
       	max-width: none;
       	width: 113%;
       	left: -6.5%;
       }
       @media all and (min-width: 43.75em) {
   
       	.entry-content .full-width {
       	  width: 128.6%;
           	  left: -14.3%;
       	}
       }
       @media all and (min-width: 56.25em) {
   
       	.entry-content .full-width {
       	  width: 150%;
           	  left: -25%;
       	}
       }
       @media all and (min-width: 68.75em) {
   
       	.entry-content .full-width {
       	  width: 163.6%;
       	  left: -31.8%;
       	}
       }
       @media all and (min-width: 75em) {
   
       	.entry-content .full-width {
       	  width: 179.9%;
           	  left: -39.95%;
       	}
       }
       ```
   
 * Then edit the post with the map or element you want to make full-width, and switch
   the editor from Visual to Text: [http://pics.competethemes.com/image/253j081L0303](http://pics.competethemes.com/image/253j081L0303)
 * Lastly, find the element you want made full-width, and put it into a `<div>` 
   HTML element with a class “full-width”. So for example, if you have a paragraph
   you want to make full-width:
 * `<p>I am a paragraph HTML</p>`
 * You would make it full-width like this:
 *     ```
       <div class="full-width">
         <p>I am a paragraph HTML</p>
       </div>
       ```
   
 * You can surround any element including the map with the full-width div now to
   make it span the entire width of the post container.
 *  Thread Starter [Shutterbabe86](https://wordpress.org/support/users/shutterbabe86/)
 * (@shutterbabe86)
 * [10 years, 11 months ago](https://wordpress.org/support/topic/making-a-map-full-width/#post-6291355)
 * Thank you for the help! Unfortunately this isnt working for SiteOrigin Google
   Maps because there is no Visual or Text to switch from.
 *  Thread Starter [Shutterbabe86](https://wordpress.org/support/users/shutterbabe86/)
 * (@shutterbabe86)
 * [10 years, 11 months ago](https://wordpress.org/support/topic/making-a-map-full-width/#post-6291356)
 * It’s ok, I just switched it to a picture instead of a map. Thank you! You’re 
   comment was still very helpful for future reference. 🙂
 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [10 years, 11 months ago](https://wordpress.org/support/topic/making-a-map-full-width/#post-6291388)
 * You’re welcome, glad it’s working now 🙂

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

The topic ‘Making a map full width’ is closed to new replies.

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

## Tags

 * [full-width](https://wordpress.org/support/topic-tag/full-width/)
 * [map](https://wordpress.org/support/topic-tag/map/)

 * 4 replies
 * 2 participants
 * Last reply from: [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * Last activity: [10 years, 11 months ago](https://wordpress.org/support/topic/making-a-map-full-width/#post-6291388)
 * Status: resolved