-1

<abbr title="This is an example. This is an example. ThisIsAnExampleThisIsAnExample ThisIsAnExampleThisIsAnExample ThisIsAnExample">test<abbr>

How I want it to be viewed:

This is an example. This is an example.
ThisIsAnExampleThisIsAnExample
ThisIsAnExampleThisIsAnExample ThisIsAnExample

How is it actually viewed:

This is an example. This is an example. ThisIsAnExam
pleThisIsAnExample ThisIsAnExampleThisIsAnExample Th
isIsAnExample

How can I customize this behaviour? How to select the title using css?

  • Not possible. You should create a div, and using javascript that div will have the contents of your title, and will only show on hover. You can try to consider using Bootstrap, or check how they did it. – threeFatCat Sep 19 '19 at 07:09
  • 1
    I am sure it is possible because here on stackoverflow when I run the snippet, it is giving me the desired view but not on my website with the same browser. –  Sep 19 '19 at 07:10
  • You were asking on **How to select the title using css**, so it is not possible. You can check @Roy 's link – threeFatCat Sep 19 '19 at 07:15
  • @threeFatCat Any official documentation link that you can post here? –  Sep 19 '19 at 07:23
  • 1
    @Roy Did you inspect the title of stackoverflow? It does not have any break tag, while the answers in the particular dupe(you think) you posted suggests using a break tag. –  Sep 19 '19 at 07:29
  • 1
    **What aren't you guys getting my point?** It works on stackoverflow, not on my website. Using the same browser. –  Sep 19 '19 at 07:33
  • 1
    How about using tooltip? https://www.w3schools.com/css/css_tooltip.asp – Shnigi Sep 19 '19 at 07:36

2 Answers2

1

Try using <b>&#013;</b> which is used for <br> line break:

<abbr title="This is an example. This is an example. &#013; ThisIsAnExampleThisIsAnExample &#013; ThisIsAnExampleThisIsAnExample ThisIsAnExample">test<abbr>

Hope it helps.

Ankit
  • 181
  • 2
  • 15
  • *Hope it helps.*, no it doesn't. –  Sep 19 '19 at 07:23
  • Add usefull comment instead of typing it doesn't comment why it doesn't. – Ankit Sep 19 '19 at 07:24
  • I don't have any control over the title, I can not customize it. I don't want to customize it using JS. I am interested in just CSS selector. –  Sep 19 '19 at 07:25
  • 1
    And btw, you missed the `;` after ` ` –  Sep 19 '19 at 07:25
  • 1
    @roundAbout I don't know but for me it worked (at least in Chrome Version 76). By the way this is possibly a dublicate of https://stackoverflow.com/questions/18606877/how-can-i-new-newline-in-title-attribute-in-html/18612227 – marcramser Sep 19 '19 at 07:30
  • 1
    @marcramser That's the problem. It works on stackoverflow, not on my website. I am sure there is something that I am missing. Btw, I have seen that answer and it is not a duplicate, sorry. –  Sep 19 '19 at 07:32
1

For Firefox, use &#10;

<abbr title="This is an example. This is an example.&#10;
ThisIsAnExampleThisIsAnExample &#10;
ThisIsAnExampleThisIsAnExample ThisIsAnExample">test<abbr>