View Full Version : Inline / block problems.

01-31-2012, 06:24 PM
Hi all. I want my paragraphs to have splits between them. But I also want them to have this jagedy effect when the line ends when with display:inline, rather than have it expand to the width of the container.

I want this effect, but this display:inline bunches up each paragraph:
(also I'd like to add padding at the end of each line)

This is with display:block - I don't want a box!


section {
top: 10%;
left: 0;


h1, h2, p {
background: #000;

#about {

#about p {
display: block;

<section id="about">
<p>I am Oliver Benns, a web enthusiast and 2nd year student at Nottingham Trent University studying Multimedia Design.</p>

<p>My fascination of art and design formed at a fairly young age. Lunch times would often be spent in the computer room working away at a little HTML on Freewebs, Piczo and <a href="http://en.wikipedia.org/wiki/Matmice" target="_blank">Matmice</a>. That 2003 stepping stone lead me to explore the computer and all such technology.</p>

<p>At college, my media and technical passion went further by obtaining A levels in Media Studies and ICT. After </p>

<p>I now study Multimedia Design at Nottingham Trent University, which I am happy with. I have the creative thrill to get me out of bed each day but also look forward to graduation, in July 2012.</p>



01-31-2012, 11:45 PM
The simplest thing would be to put a span around the text (inside the paragraph) and apply the background color to this.