Inlines with white-space:nowrap and initial spaces can wrap on those initial spaces




Layout: Text
5 years ago
4 years ago


(Reporter: Franjo, Unassigned)


24 Branch
Windows 7

Firefox Tracking Flags

(Not tracked)



(1 attachment)



5 years ago
User Agent: Mozilla/5.0 (Windows NT 6.1; rv:24.0) Gecko/20100101 Firefox/24.0 (Beta/Release)
Build ID: 20130910160258

Steps to reproduce:

div,span {
 border:1px solid red;
 white-space: nowrap;

<table border="1" width=534>
     <div>section 444</div>
     <div> section 444</div>
     <div> section 22</div>
     <div> section 333</div>
     <div> section 444</div>

Actual results:

You may want to change "width=534" to "width=100%" and resize your window to see the wrapping of last 4 div elements. First part of the border stays on the top line, while all div contents are in the next line (with partial border). You can see that "nowrap" works for spaces in between "section" word and a number, but not for a single space (or any delimiter, like a new line) before "section" word.

Expected results:

Keep the border in one piece, as most other browsers do (IE, Safari, etc)


5 years ago
Component: Untriaged → Layout
Product: Firefox → Core
Hmm.  The linebreak opportunities here are between the divs, of course.  It's not clear to me what the right behavior here is per spec, but it sounds like we're doing whitespace collapsing before doing linebreak determination, and the collapsed space is marked as breakable (because one of the things that went into it was)?
Component: Layout → Layout: Text
Flags: needinfo?(roc)
Created attachment 812834 [details]
Simple testcase clearly showing the problem
Ever confirmed: true
Summary: div or span elements wrap improperly inside a table cell → Inlines with white-space:nowrap and initial spaces can wrap on those initial spaces
gThe frame tree looks like this:

            line 0x7fffcc0dc330: count=3 state=inline,clean,prevmarginclean,not impacted,wrapped,before:nobr,after:nobr[0x120] {0,0,2820,1140} vis-overflow=0,-180,2820,1500 scr-overflow=0,-180,2820,1500 <
              Inline(span)(0)@0x7fffcc0dbf78 next=0x7fffcc0dc060 {0,0,2640,1140} [state=0000100000000200] [content=0x7fffd7c402c0] [sc=0x7fffcc0db970]<
                Text(0)"some"@0x7fffcc0dbff0 {0,0,2640,1140} [state=00000040b0200000] [content=0x7fffd7c40350] [sc=0x7fffcc0dba20:-moz-non-element] [run=0x7fffa054a060][0,4,T] 
              Text(1)" "@0x7fffcc0dc060 next=0x7fffcc0dc0d0 {2640,0,0,1140} [state=00000000a8400000] [content=0x7fffd7c403e0] [sc=0x7fffcc0dbce0:-moz-non-element] [run=0x7fffa054a060][0,1,T] 
              Inline(span)(2)@0x7fffcc0dc0d0 next=0x7fffcc0dcc18 next-in-flow=0x7fffcc0dcc18 {2640,-180,180,1500} [state=0000104000000200] [content=0x7fffd7c40470] [sc=0x7fffcc0dbdc8]<
                Text(0)" "@0x7fffcc0dc270 next-in-flow=0x7fffcc0dcb90 {180,1080,0,0} [state=0000000021400000] [content=0x7fffd7c40500] [sc=0x7fffcc0dbed8:-moz-non-element] [run=0x7fffa054a060][0,1,F] 
            line 0x7fffcc0dcc90: count=1 state=inline,clean,prevmarginclean,not impacted,not wrapped,before:nobr,after:nobr[0x100] {0,1140,2160,1140} vis-overflow=0,960,2160,1500 scr-overflow=0,960,2160,1500 <
              Inline(span)(2)@0x7fffcc0dcc18 prev-in-flow=0x7fffcc0dc0d0 {0,960,2160,1500} [state=0000104000000204] [content=0x7fffd7c40470] [sc=0x7fffcc0dbdc8]<
                Text(0)"text"@0x7fffcc0dcb90 prev-in-flow=0x7fffcc0dc270 {0,180,1980,1140} [state=8000004090600004] [content=0x7fffd7c40500] [sc=0x7fffcc0dbed8:-moz-non-element] [run=0x7fffa054a060][1,4,T] 

It looks like there's a few problems here:
a) We allow a break after the leading space --- I think because it collapsed with the first space, which is breakable.
b) For some reason we allow the first part of the span, which is really just the left border, to fit on the first line.
c) We draw the border in the wrong place on the first line, probably because the final space is trimmed to take zero width.
Flags: needinfo?(roc)
You need to log in before you can comment on or make changes to this bug.