我正在尝试更改我在段落之间放置的边框的长度,同时我想让每个开头段落开头的边框左边与文本匹配而不是高于它。
.header{
text-transform:capitalize;
color:#2c3e50;
font-weight:700;
}
p{
line-height:1.5;
font-weight:600;
}
.date{
color:#3498db;
text-transform:uppercase;
font-weight:600;
letter-spacing:2px;
}
body{
font-family: 'Source Sans Pro', sans-serif;
font-size: 14px;
}
#container{
border:15px solid #bdc3c7;
margin:30px 100px;
padding:20px;
}
#paragraph{
border-bottom:1px solid #bdc3c7;
border-width
}
#paragraph p:nth-of-type(2){
border-left:3px solid #bdc3c7;
margin-left:10px;
padding:5px;
}
<!DOCTYPE html>
<html>
<head><title>Photo Blog</title><link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700" rel="stylesheet">
</head>
<body>
<div id="container">
<div id="paragraph">
<p class="date">March 18 2017</p>
<h1 class="header">this is my first article</h1>
<p>Bacon ipsum dolor amet jowl pork chop ribeye shankle landjaeger andouille kielbasa. Fatback short loin tri-tip shank strip steak ball tip pork ground round flank capicola boudin. </p><p>Venison ribeye ham, shoulder picanha alcatra short loin strip steak jowl tongue porchetta salami capicola. Bresaola pancetta leberkas swine beef ribs, pork loin bacon hamburger. Beef ribs picanha fatback landjaeger, meatball pig turkey pork belly t-bone capicola.</p>
<p>Jerky pork loin leberkas sausage t-bone, ball tip meatball fatback drumstick kielbasa. Porchetta tail cow, turkey capicola sausage andouille spare ribs kielbasa kevin. Beef ribs fatback cupim kielbasa ball tip, pork loin spare ribs flank. Salami rump chicken, doner kevin bacon kielbasa shankle drumstick biltong spare ribs cow brisket. Bacon pork biltong cow ham hock chuck. Ribeye beef brisket fatback, short loin sausage picanha. Pig venison picanha, fatback pork loin meatball leberkas tenderloin tongue ham hock ground round frankfurter t-bone pork belly.</p>
</div>
<div id="paragraph">
<p class="date">March 18 2017</p>
<h1 class="header">this is my first article</h1>
<p>Bacon ipsum dolor amet jowl pork chop ribeye shankle landjaeger andouille kielbasa. Fatback short loin tri-tip shank strip steak ball tip pork ground round flank capicola boudin. </p><p>Venison ribeye ham, shoulder picanha alcatra short loin strip steak jowl tongue porchetta salami capicola. Bresaola pancetta leberkas swine beef ribs, pork loin bacon hamburger. Beef ribs picanha fatback landjaeger, meatball pig turkey pork belly t-bone capicola.</p>
<p>Jerky pork loin leberkas sausage t-bone, ball tip meatball fatback drumstick kielbasa. Porchetta tail cow, turkey capicola sausage andouille spare ribs kielbasa kevin. Beef ribs fatback cupim kielbasa ball tip, pork loin spare ribs flank. Salami rump chicken, doner kevin bacon kielbasa shankle drumstick biltong spare ribs cow brisket. Bacon pork biltong cow ham hock chuck. Ribeye beef brisket fatback, short loin sausage picanha. Pig venison picanha, fatback pork loin meatball leberkas tenderloin tongue ham hock ground round frankfurter t-bone pork belly.</p>
</div>
<div id="paragraph">
<p class="date">March 18 2017</p>
<h1 class="header">this is my first article</h1>
<p>Bacon ipsum dolor amet jowl pork chop ribeye shankle landjaeger andouille kielbasa. Fatback short loin tri-tip shank strip steak ball tip pork ground round flank capicola boudin. </p><p>Venison ribeye ham, shoulder picanha alcatra short loin strip steak jowl tongue porchetta salami capicola. Bresaola pancetta leberkas swine beef ribs, pork loin bacon hamburger. Beef ribs picanha fatback landjaeger, meatball pig turkey pork belly t-bone capicola.</p>
<p>Jerky pork loin leberkas sausage t-bone, ball tip meatball fatback drumstick kielbasa. Porchetta tail cow, turkey capicola sausage andouille spare ribs kielbasa kevin. Beef ribs fatback cupim kielbasa ball tip, pork loin spare ribs flank. Salami rump chicken, doner kevin bacon kielbasa shankle drumstick biltong spare ribs cow brisket. Bacon pork biltong cow ham hock chuck. Ribeye beef brisket fatback, short loin sausage picanha. Pig venison picanha, fatback pork loin meatball leberkas tenderloin tongue ham hock ground round frankfurter t-bone pork belly.</p>
</div>
</div>
</body>
</html>