2014-04-13 56 views
0

我想刪除文章標記中的h2和p元素之間的空行(爲什麼使用文章?MY教練問我們在我們的項目中使用了5個新的html5元素。)我曾嘗試過:如何刪除h2和段落之間的空格

#prime h2 { 
    margin-top:0em; 
} 

#prime p { 
     margin-bottom:0em; 
} 

這使我的h2一路向右移動到兩行。 。 然後我試圖堆棧/溢出建議從Josmh回答10月13日在'11 19:16:

#prime h2,p{ 
     padding: 0; 
     margin: 0; 
    } 

    #prime h2,p { 
     display: inline; 
    } 

這卡羅爾動了我的導航欄的同一行H2,歡迎各締約方。

代碼不工作,因爲我正在使用文章?我的代碼:

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Parties by Carol</title> 
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script> 
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css"> 
<link href="css/main.css" rel="stylesheet" type="text/css"> 
</head> 

<body> 
<div id="wrapper"> 
    <header id="hdr"> 
    <h3>throw a ball</h3> 
    <h2>throw a line</h2> 
    <h1>Throw a Party!</h1> 
    <div id="party"><img src="images/balloons2.jpg" width="125" height="125" alt="A Party"/></div> 
    <p>Parties by Carol</p> 
    <ul id="MenuBar1" class="MenuBarHorizontal"> 
     <li><a href="Final-1.html">Home</a></li> 
     <li><a href="#">About Us</a></li> 
     <li><a class="MenuBarItemSubmenu" href="#">Types of  Parties</a> 
     <ul> 
      <li><a href="#">Quinceneras/Sweet 16</a></li> 
      <li><a href="#">Bar/Bat Mitzvahs</a></li> 
      <li><a href="#">Tots and Toddlers</a></li> 
     </ul> 
     </li> 
     <li><a href="#">Contact Us</a></li> 
    </ul> 
    </header> 
    <article id="prime"><h2>Welcome to Parties by Carol</h2> 
    <p> 
     For your next celebration, contact Parties by Carol. Whether your event is for two or two hundred, Parties by Carol can and will accommodate your needs. We specialize in fulfilling your every wish, whether at our facility or a location of your choice. We have a wide and varied menu that can be customized for your special event. Parties by Carol offers a combination of skills to help create unique and memorable occasions for you and your guests. So relax and leave everything to Parties by Carol. We aim to please and we will.</p> 
    </article> 
    <aside id="sbar1"> 
    <p>Beautiful Venue</p> 
    <p>Devine Food</p> 
    <p>Great Music</p> 
    <p>Fun People</p> 
    <p>&nbsp;</p> 
    </aside> 
    <footer>&copy;Copyright - 2014 CAS</footer> 
</div> 
<script type="text/javascript"> 
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"}); 
</script> 
</body> 
</html> 



#prime h2 { 
    margin-top:0; 
} 

#prime p { 
     margin-bottom:0; 
} 

#prime h2, p { 
    display: inline; 
} 

回答

0

不應該用其他方式設置邊距嗎?我猜<p>低於<h2>

h2 { 
    margin-BOTTOM: 0; 
} 

p { 
    margin-TOP: 0; 
} 
+0

這是行不通的。我想知道它是不是工作,因爲h2和p是文章。感謝您的迴應。 – user2847948