Readthedocs Theme: Force break of inline code

[ePirat]

Using the ReadTheDocs theme, inline code

`code`

should be forced to break, so that it does not break the responsive layout.

[d0ugal]

So, this is an issue if the line is too long? Any ideas how you would fix it in CSS?

[ePirat]

Just use word-wrap: break-word; so it will break even in the middle of words.

[tomchristie]

Wouldn't we want horizontal scrolling instead. I don't think we should ever wrap code lines.

[ePirat]

@tomchristie I strongly disagree. Scrolling might be fine for blocks of code (even there most of the time it annoys me), but it definitely isn't for inline code.
Indentation should not matter for inline code, so I see absolutely no problem with breaking it to the next line.
What actually never should be done is logical hyphenization, i.e. if (superman) vs. if (super-[newline]man. So setting hyphens: none; might be a good idea for code.

[tomchristie]

A screenshot example would probably be a good idea. I'd expect inline code to fall onto the next line as a single block if it's too long, no?

[d0ugal]

I think the issue is when the single block is winder than the width of the device.

[ePirat]

Currently:

With word-wrap: break-word;

[tomchristie]

Okay, that's super helpful. Second case to compare here would be when the block is inline with text before.

Say we have...

this is some text `and-an-`
`[newline]inline-block` more text

We wouldn't want that kind of wrapping. However this makes it look to me like the break-word behavior is correct.

The long word still starts on a newline, and only breaks if it's longer than the entire viewport which is what I'd want to see.