Marquee - line breaking into two instead of a single line - css

StackOverflow https://stackoverflow.com/questions/20674258

  •  19-09-2022
  •  | 
  •  

Question

My div css looks like

#another_div
{
    white-space:pre-wrap;
    font-size:1.5em;
    position:fixed;
    height:6%;
    display:block;
    background:#FFF;
    width:100%;
    text-align:center;
    top:30%;
    padding-top:1%;
    -webkit-marquee: auto medium infinite scroll normal;   
    overflow-x: -webkit-marquee;


}

In this div I am loading some dynamic content coming from some page. It's showing like

AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

                         BBBBBBBBBB

But I want it as

AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABBBBBBBBBBBBBB

I already tried the "white-space": "nowrap". Didn't work.

It's a marquee so it should be floating in a single line. Why is it breaking?? I checked the line. There is no line breaking tag. How can I make it marquee in a single line?

Was it helpful?

Solution

white-space: nowrap; should work. Check the demo below

DEMO

OTHER TIPS

white-space: pre; will take out all your breaks!

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top