Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to insert a line break before an element using CSS

Tags:

css

I feel like I saw a way, using the CSS content property, to insert a line break tag before an element. Obviously this doesn't work:

#restart:before { content: '<br/>'; } 

But how do you do this?

like image 650
mheavers Avatar asked Sep 09 '11 15:09

mheavers


People also ask

What can I use instead of Br in CSS?

There are many ways to break the line without using <br> tag. The used properties are listed below: white-space: pre; It is used to make elements acts like <pre> tag. display: block; It sets the display property of elements to block.

How do you put a line break in a div tag?

You can insert line breaks in HTML with the <br> tag, which is equivalent to a carriage return on a keyboard.

How do you code a line break?

The <br> HTML element produces a line break in text (carriage-return). It is useful for writing a poem or an address, where the division of lines is significant.

Which element would you use for inserting breaks?

The <br> element is used to insert a line break or carriage-return within a parent element such as a paragraph without breaking out of the parent container.


1 Answers

It's possible using the \A escape sequence in the psuedo-element generated content. Read more in the CSS2 spec.

#restart:before { content: '\A'; } 

You may also need to add white-space:pre; to #restart.

note: \A denotes the end of a line.

p.s. Another treatment to be

:before { content: ' '; display: block; } 
like image 187
bookcasey Avatar answered Sep 28 '22 16:09

bookcasey