espacio entre párrafos

[picasona]

Buenas a todos, sigo con mi web y estoy haciendo una página con fotos y su explicación debajo, y necesito entre párrafo y párrafo un espacio pq me sale muy pegado, necesito vuestra ayuda urgenteeeee, gracias. Os paso el trozo que os digo:
<article id="content">
<div class="wrapper">
<div class="box1">
<div class="line1">
<div class="line2 wrapper">
<section class="col1">
<h2><strong>C</strong>orreas<span></span></h2>
<div class="pad_bot1">
<figure><img src="images/page1_img1.jpg" alt=""></figure>
</div>
CORREAS EXTENSIBLES <a href="#" class="button1">Read More</a> </section>
<section class="col1 pad_left1">
<h2 class="color2"><strong>T</strong>rue<span>Story 2</span></h2>
<div class="pad_bot1">
<figure><img src="images/page1_img2.jpg" alt=""></figure>
</div>
CORREAS EXTENSIBLES<a href="#" class="button1 color2">Read More</a> </section>
<section class="col1 pad_left1">
<h2 class="color3"><strong>T</strong>rue<span>Story 3</span></h2>
<div class="pad_bot1">
<figure><img src="images/page1_img3.jpg" alt=""></figure>
</div>
CORREAS EXTENSIBLES<a href="#" class="button1 color3">Read More</a> </section>
<section class="col1">
<h2><strong>T</strong>rue<span>Story 1</span></h2>
<div class="pad_bot1">
<figure><img src="images/page1_img1.jpg" alt=""></figure>
</div>
CORREAS EXTENSIBLES <a href="#" class="button1">Read More</a> </section>
<section class="col1 pad_left1">
<h2 class="color2"><strong>T</strong>rue<span>Story 2</span></h2>
<div class="pad_bot1">
<figure><img src="images/page1_img2.jpg" alt=""></figure>
</div>
CORREAS EXTENSIBLES<a href="#" class="button1 color2">Read More</a> </section>
<section class="col1 pad_left1">
<h2 class="color3"><strong>T</strong>rue<span>Story 3</span></h2>
<div class="pad_bot1">
<figure><img src="images/page1_img3.jpg" alt=""></figure>
</div>
CORREAS EXTENSIBLES<a href="#" class="button1 color3">Read More</a> </section>
<section class="col1">
<h2><strong>T</strong>rue<span>Story 1</span></h2>
<div class="pad_bot1">
<figure><img src="images/page1_img1.jpg" alt=""></figure>
</div>
CORREAS EXTENSIBLES <a href="#" class="button1">Read More</a> </section>
<section class="col1 pad_left1">
<h2 class="color2"><strong>T</strong>rue<span>Story 2</span></h2>
<div class="pad_bot1">
<figure><img src="images/page1_img2.jpg" alt=""></figure>
</div>
CORREAS EXTENSIBLES<a href="#" class="button1 color2">Read More</a> </section>
<section class="col1 pad_left1">
<h2 class="color3"><strong>T</strong>rue<span>Story 3</span></h2>
<div class="pad_bot1">
<figure><img src="images/page1_img3.jpg" alt=""></figure>
</div>
CORREAS EXTENSIBLES<a href="#" class="button1 color3">Read More</a> </section>
</div>
</div>
</div>
</div>
</article>

[C2am]

Te falta mostrar lo más importante en un foro de CSS, es decir, el código CSS.

No veo párrafos en tu html (<p>) pero supongo que te refieres a las secciones.

Para separar un poco dichas secciones puedes usar el margin o el padding.
Estas propiedades deben estar definidas en el css que no muestras.

Saludos

[picasona]

este es lo código css:
/* ============================= content ====================== */
#content {
}
.pad_left1 {
padding-left:26px
}
.pad_left2 {
padding-left:36px
}
.pad_bot1 {
padding-bottom::14px
}
.pad_bot2 {
padding:4px 0 50px 0
}
.marg_right1 {
margin-right:37px
}
.box1 {
background:url(../images/bg_box1.jpg) top center no-repeat #dad6cc;
border-top:5px solid #cdc8bc;
padding:15px 30px 29px
}
.box1 strong {
color:#3f3f3f
}
.box1 figure {
box-shadow:0 0 3px #a4a19a;
-moz-box-shadow:0 0 3px #a4a19a;
-webkit-box-shadow:0 0 3px #a4a19a;
position:relative
}
.box2 {
background:#0e0c0a;
padding:25px 30px 32px
}
.box2 .line1, .box2 .line2 {
background-image:url(../images/line_vert2.gif)
}
#page4 .box2 {
margin-top:7px;
padding-top:30px;
padding-bottom:28px
}
.line1 {
background:url(../images/line_vert1.gif) 289px 0 repeat-y
}
.line2 {
background:url(../images/line_vert1.gif) 591px 0 repeat-y
}
#page3 .line1 {
background-position:282px 0
}
.relative {
position:relative
}
.button1 {
float:right;
color:#dddad1;
text-decoration:none;
background:#000;
line-height:18px;
padding:0 9px;
margin-top:2px
}
* + html .button1 {
margin-top:-20px
}
.button1 {
color:#dddad1
}
.button1:hover {
background:#ffb919;
color:#fff
}
.button1.color2 {
color:#dddad1
}
.button1.color2:hover {
background:#94c932;
color:#fff
}
.button1.color3 {
color:#dddad1
}
.button1.color3:hover {
background:#63d1a7;
color:#fff
}
.button2 {
display:inline-block;
font-size:15px;
color:#fff;
text-transform:uppercase;
text-decoration:none;
padding:0 21px;
height:36px;
line-height:34px;
font-weight:400;
background:url(../images/button1_bg.gif) top repeat-x;
letter-spacing:-1px
}
.button2.color2 {
background-image:url(../images/button2_bg.gif)
}
.button2.color3 {
background-image:url(../images/button3_bg.gif)
}
.button2:hover {
background:#000
}
.color0 {
color:#616161;
text-decoration:none
}
.link1 {
text-decoration:none
}
.link1:hover {
text-decoration:underline
}
.quot {
margin-top:17px;
float:left;
margin-left:94px;
padding:12px 0 17px 41px;
font-style:italic;
background:url(../images/quot1.png) 0 0 no-repeat;
width:570px
}
.quot img {
display:inline-block;
margin:4px 0 0 9px
}
#page2 .quot {
padding-bottom:7px
}
.list1 {
margin-top:-2px;
margin-bottom:-2px
}
.list1 li {
line-height:26px
}
.list1 li a {
color:#dcd8cf;
padding-left:22px;
background:url(../images/marker_1.gif) 0 3px no-repeat
}
.list1 .color2 a {
background-position:0 -23px
}
.list1 .color3 a {
background-position:0 -49px
}
/*--- tabs begin ---*/
.tabs {
}
.tabs ul.nav {
padding:27px 0 27px 2px;
overflow:hidden
}
.tabs ul.nav li {
float:left;
padding-left:31px
}
.tabs ul.nav li a {
font-size:35px;
color:#ddd9cf;
font-weight:400;
text-decoration:none;
line-height:1.2em;
letter-spacing:-1px
}
.tabs ul.nav .selected a, .tabs ul.nav a:hover {
color:#ffc11e
}
.tabs .tab-content {
}

[C2am]

No veo donde está definida la clase "col1"
Podrías modificarla o crearla

Código CSS:

.col1{ margin-bottom:10px;
}
 

O definir el margin-top, o ambos margin-top y margin-bottom, etc.

Aprender: www.librosweb.es

Saludos