Crosswords: IE11 - Overlapping numbers on cryptic crossword

[gtrufitt]

If there is a group, the numbers on the cryptic crossword overlap in IE11:

This looks like it's due to the use of position: inital which is not a valid property in IE and it therefore drops back to position: absolute (and no padding on the clue).

CC/ @NathanielBennett

[gtrufitt]

Probably need to look at how we want this to display, but we could use display: table & table-cell (or flex-box) to ensure we keep the clue wrapping flush and the numbers to the left. Quick example (untested): http://jsbin.com/gewiwojeve/edit?html,css,output

[OliverJAsh]

position: static is the initial value so we could try that? Or, we could have proper wrapping using table/flex-box. (Currently the second line wraps underneath the clue number "column".) I don't mind :-)

On Thu, 10 Sep 2015 at 17:45 Gareth Trufitt notifications@github.com wrote:

Probably need to look at how we want this to display, but we could use display: table & table-cell (or flex-box) to ensure we keep the clue wrapping flush and the numbers to the left. Quick example: http://jsbin.com/gewiwojeve/edit?html,css,output

— Reply to this email directly or view it on GitHub https://github.com/guardian/frontend/issues/10474#issuecomment-139306506 .

---

Visit theguardian.com. On your mobile and tablet, download the Guardian iPhone and Android apps theguardian.com/guardianapp and our tablet editions theguardian.com/editions. Save up to 57% by subscribing to the Guardian and Observer - choose the papers you want and get full digital access. Visit subscribe.theguardian.com

This e-mail and all attachments are confidential and may also be privileged. If you are not the named recipient, please notify the sender and delete the e-mail and all attachments immediately. Do not disclose the contents to another person. You may not use the information for any purpose, or store, or copy, it in any way. Guardian News & Media Limited is not liable for any computer viruses or other material transmitted with or as part of this e-mail. You should employ virus checking software.

Guardian News & Media Limited is a member of Guardian Media Group plc. Registered Office: PO Box 68164, Kings Place, 90 York Way, London, N1P 2AP. Registered in England Number 908396

[gtrufitt]

position: static is the initial value so we could try that?

Yeah I quickly tried this, worked in chrome/FF but IE11 the number just disappeared altogether :laughing:

Or, we could have proper wrapping using table/flex-box.

This looked 'tidier' to me but may make force the actual space for the clue to end up too thin if you have more than 2/3 numbers (don't know how often this is the case?). It should probably be consistent between clues with one number and multiple numbers though (both wrap underneath number/neither wrap underneath number)?

[OliverJAsh]

The worse offender we've seem so far is www.theguardian.com/crosswords/cryptic/26666 (coincidentally, the devils number). Have a look at 2-down

On Fri, 11 Sep 2015 at 10:35 Gareth Trufitt notifications@github.com wrote:

position: static is the initial value so we could try that?

Yeah I quickly tried this, worked in chrome/FF but IE11 the number just disappeared altogether [image: :laughing:]

Or, we could have proper wrapping using table/flex-box.

This looked 'tidier' to me but may make force the actual space for the clue to end up too thin if you have more than 2/3 numbers (don't know how often this is the case?)

— Reply to this email directly or view it on GitHub https://github.com/guardian/frontend/issues/10474#issuecomment-139500143 .

---

Visit theguardian.com. On your mobile and tablet, download the Guardian iPhone and Android apps theguardian.com/guardianapp and our tablet editions theguardian.com/editions. Save up to 57% by subscribing to the Guardian and Observer - choose the papers you want and get full digital access. Visit subscribe.theguardian.com

This e-mail and all attachments are confidential and may also be privileged. If you are not the named recipient, please notify the sender and delete the e-mail and all attachments immediately. Do not disclose the contents to another person. You may not use the information for any purpose, or store, or copy, it in any way. Guardian News & Media Limited is not liable for any computer viruses or other material transmitted with or as part of this e-mail. You should employ virus checking software.

Guardian News & Media Limited is a member of Guardian Media Group plc. Registered Office: PO Box 68164, Kings Place, 90 York Way, London, N1P 2AP. Registered in England Number 908396

[gtrufitt]

Have a look at 2-down

Yikes - yeah, you'll be pushing the clue pretty tight with something like that. Not completely unreadable, but not the nicest.

[OliverJAsh]

May be best to keep the wrapping? If we can find a way to do that and keep IE11 happy :-) I think @NathanielBennett worked on this originally