html - Trouble with margins and borders -


i trying create 2 boxes 80% wide, including 8px border. (unless can create % border, not think can) now, when set 10% margin on right , left sides of boxes, off right few pixels. there way fix this?

html:

<div id="upcoming_show" class="front_page_item grid_8">         <div class="left front_block_headline">             <h2 class="upper_headline">upcoming show:</h2>             <h1>the walrus</h1>         </div>         <p>the walrus show shows human spirit. main character, mickey, found lying face down on beach in middle of...</p>         <p><a href="#" class="btn right">read more</a></p>     </div>      <div id="recent_post" class="front_page_item grid_8">         <div class="left front_block_headline">             <h2 class="upper_headline">recent post:</h2>             <h1>gsa blast!</h1>         </div> 

css:

#upcoming_show {     margin-right: 10%;     margin-left: 10%;     min-height: 200px; }  #recent_post {     margin-right: 10%;     margin-left: 10%;     min-height: 200px; }  .front_page_item {     text-align: center;     border: 8px solid #c8c8c8; } 

upcoming show has 2 right magins set.


Comments

Popular posts from this blog

html - Sizing a high-res image (~8MB) to display entirely in a small div (circular, diameter 100px) -

java - IntelliJ - No such instance method -

identifier - Is it possible for an html5 document to have two ids? -