Search code examples
htmlcssmobile-website

Margins of <p> on website are same code but look different


On the website that I'm building, some pages the text extends all the way to the edges. I've compared the HTML for ages, and don't see what I'm doing wrong. Maybe it's in the CSS? Does anyone see what's going on? I tried refreshing my browser and clearing my cache.

Why does p extend to to the edge on only some of my pages? When the HTML looks the same?

<div id="wrapper3">
<div id="portfolio" class="container">
<div class="title">
<h2></h2>
<span class="byline"><!--Integer sit amet pede vel arcu aliquet pretium--></span> 
<br>
<p></p>
<p></p>
</div>
</div>


Solution

  • Since you only have a little text, it would look much better with a narrow paragraph, like this :

    p {
        line-height: 180%;
        margin-left: auto;
        margin-right: auto;
        text-align: justify;
        width: 600px;
    }
    

    You will always have the same width, centered, and the text will be displayed "as in a book"