Break lines in CSS without using extra elements

Asked

Viewed 12,118 times

7

I have 2 elements inline and I need to get the line broken without me having to add display: block; or if possible add but not occupy 100% of the line:

<div class="box-error-page cb">
    <h1 class="title-page-error title-error-default fleft">
        404
    </h1>

    <h2 class="title-not-found title-error-default">
        Ops! Página não encontrada
    </h2>

    <p>Não foi possível localizar o link que você estava buscando.</p>

    <a href="" class="cb">Ir à página inicial</a>
    <a href="javascript:history.go(-1);" class="cb">Voltar à página anterior</a>
</div>

In case the 2 links at the end, should break line, I wanted to see if there is any form, without the need to use extra elements, just to break the line, I know I could do with UL>LI.

html css

  • I don’t understand why the question was downvoted.

  • It is "normal" to appear downvote without justification. Few assume what they do (no offense to those who did it because they do not know who it was) and/or justify the reason.

  • A pity, because I found the question very legitimate. And I saw that downvote takes a point of your reputation, so it doesn’t make much sense to distribute.

  • 1

    @Marta, this kind of unfair downvote ends up self-correcting. Your first comment is very constructive in this sense. Ah, yes, ++ in your reply, cool the technique :)

1 answer

10


You can use the pseudo-element :after 

a:after{content:""; display:block; clear:both}

The :after works from IE8. With it you create an element in CSS, so you don’t need to mess with your HTML.

Example: http://jsfiddle.net/xqbyeq6k/

  • Thank you!! That’s right. : D

Browser other questions tagged html css

You are not signed in. Login or sign up in order to post.