ABu
ABu

Reputation: 12269

String attribute values in multiple lines, HTML

Is it possible, in HTML to write something like:

<a href="bla bla bla bla\
        bla bla bla bla">....</a>

The idea is splitting a string attribute in different lines to improve readability.

Upvotes: 31

Views: 27941

Answers (6)

Nadu
Nadu

Reputation: 2501

Yes that's possible: https://stackoverflow.com/a/38874964/3135511 The secret is to use tab's instead of space As well as to use linebreaks

<a href="
    bla 
    bla bla 
    bla bla bla 
    bla bla 
    bla
    ">....</a>
Try out the code and hover over the .... And look for the link - it should read just like bla bla bla bla bla bla bla bla bla

Background:

  • A space in a string will be escaped to %20 and so stay in, but white spaces as tab & line break will be discarded/filtered out.

    If you want them in a string write %09 for Tab and %0A%0D for some CR/LF windows line break. -> They are two bytes one Carrier Return char and some Line Feed char.

Upvotes: 27

ElChupacabra
ElChupacabra

Reputation: 1091

Are you allowed to use PHP? If so you could do:

<a href="<?= "very "
             ."long "
             ."string" ?>">

Upvotes: 0

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201588

No, it is not possible. HTML has no “line continuation” character. If you put a line break in an attribute value, browser behavior varies, but modern browsers behave in the manner documented in HTML5: a line break is allowed, and it is taken literally and stored as a line break in the DOM. This means that href attribute value is broken and does not work.

The best you do to alleviate the problem of long href values is to put such a value on a line of its own, without quotation marks:

<a href=
http://www.example.com/some-long-path/and-so-on
>link</a>

In contrast, the following is allowed and causes as two-liner tooltip (in modern browsers). The point is that the general syntax allows line breaks, but they have consequences, and the specific syntax of an attribute may forbid line breaks.

<a href=foo title="Hello
world">bar</a>

Upvotes: 14

Felix
Felix

Reputation: 38102

You can use @laaposto suggestion as long as there's no space between lines.

If you don't want to follow that rule, then you need to use javascript to remove the spaces:

var anchor = document.getElementsByTagName("a");

for(var i=0; i<= anchor.length; i++) {
    var href = anchor[i].href.replace(/%20/g,'');
    anchor[i].href = href;     
}

Fiddle Demo

or easier with jQuery:

var href = $('a').attr('href').replace(/ /g,'');
$('a').attr('href', href);

Fiddle Demo

Upvotes: 1

Vijay Kumar
Vijay Kumar

Reputation: 345

you can write in any ways but make sure that there is no any space between lines.

Linke this one

<a href="http://stackoverflow
.com/quest
ions/228319
88/string-attribute-values-in-multiple-lines-html">

Upvotes: 0

laaposto
laaposto

Reputation: 12213

You can do it without any break character. Just like this:

<a href="http://stackoverflow.com
/questions/
22831988/
string-attribute-values-in-multiple-lines-html">
LINK
</a>

DEMO

Upvotes: 5

Related Questions