CODEWITHSUNDEEP
tagssemanticsline-breaks
Yannis Dran
Yannis Dran

Reputation: 1529

<br> tag semantic alternative usage

Well, I know that
is unsemantic. The problem is that when there are paragraphs such as:

Hello friend.
Today I learnt a new trick but I m not gonna tell you yet.

Ok, I'm just kidding. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Rhoncus at magna. Nulla aliquam turpis ac magna scelerisque vel eleifend libero malesuada.
Quisque facilisis leo et elit ultricies id suscipit leo ornare. Vestibulum mi odio, facilisis non fringilla vitae, imperdiet egestas mauris. Nunc enim erat, vehicula vel malesuada nec.

As you can see there are two paragraphs. Both they have a line break in the middle done by a <br> tag. How can i do it without the use of this tag for semantic's sake?

Note: The bold "malesuada" was inserted to help you identify the second linebreak easily.

Upvotes: 2

Views: 840

Answers (1)

Charles Wyke-Smith
Charles Wyke-Smith

Reputation: 2507

First, line breaks are intended to be used in situations where the break must occur within the flow of text, such as in a poem.

The generally accepted way to markup text like this is as paragraphs, which are block level and therefore always create a new line, and to set the margins between them. Here you have two paragraph styles, one that requires space and one that does not. You could have two different styles of paragraph like this (and I just illustrate the vertical margins here - the horizontal ones are set to 0).

p {margin:.1em 0;}

p.special {margin:0;}

Then just add the class "special" to the paragraphs without space. Note the vertical margins will collapse so you will only get 1em of space between each paragraph.

My bigger question though is a design one: why do you want to organize your paragraphs like this? Why not just have a standard paragraph spacing throughout and perhaps using headings to group the sets of paragraphs? What you are doing is rather unconventional, which is why you are running into problems finding the right HTML elements to use. hth, charles

Upvotes: 2

Related Questions