Use border the wrap around a paragraph : p border « Tags « HTML / CSS






  1. HTML / CSS
  2. Tags
  3. p border

Use border the wrap around a paragraph

     

<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style rel="stylesheet" type="text/css">

.box {
  background-color: #EDF1F2;
  border: 1px solid #BFCAD5;
  padding: 10px;
  font-size: 0.9em;
  color: #6A849D;
}

.box h2 {
  color: #993333;
  font-size: 1.2em;
}


</style>

</head>
<body>

      <div class="box">
        <h2>Lorem Ipsum </h2>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.. </p>
      </div>

</body>
</html>








Related examples in the same category

1.This is a paragraph with an inset border
2.This is a paragraph with a solid border
3.This is a paragraph with a dotted border
4.This is a paragraph with a dashed border
5.This is a paragraph with a double border
6.This is a paragraph with a groove border
7.This is a paragraph with a ridge border
8.p border: 1px solid steelblue;
9.p border:solid black 1px;
10.p border: 1px solid rgb(200, 200, 200);
11.p border: 1px solid rgb(29, 179, 82);
12.p border: none;
13.p border: 1px solid lightblue;
14.p border-top: solid;
15.p {border-style:solid; border-color:#000000; border-width:2px; padding:5px; width:200px; background-color:#FFFFFF;}
16.Paragraph with various border styles
17.paragraph with various border style
18.p border: 1px solid black;