[bug?] Custom bgcolor in code block scrollt niet mee

[.oisyn]

Hele vreemde bug, ik vermoed misschien zelfs een browser issue? Want met mijn mediocre kennis van HTML en CSS kan ik 'm niet verklaren.

Goed, ik heb dus een custom CSS waarin ik de kleuren van de code blokken aanpas. Ik heb een scheme voor een witte tekst op een donkere achtergrond.

Cascading Stylesheet:

.phphighlightcode pre { background-color: #333333 !important; color: white !important; }

Hier heb ik een stuk code (schaamteloos gejat uit alienfruit in "De Devschuur Coffee Corner - Iteratie ⓬")

code:

[17579:0x102801000]   137838 ms: Mark-sweep 1343.9 (1468.4) -> 1343.8 (1468.4) MB, 2292.6 / 0.1 ms  allocation failure GC in old space requested
[17579:0x102801000]   139211 ms: Mark-sweep 1343.8 (1468.4) -> 1343.8 (1437.4) MB, 1372.8 / 0.1 ms  last resort GC in old space requested
[17579:0x102801000]   140371 ms: Mark-sweep 1343.8 (1437.4) -> 1343.8 (1437.4) MB, 1160.3 / 0.1 ms  last resort GC in old space requested

En dat ziet er dan zo uit bij mij:



Alles goed en wel. Maar scroll ik nu naar rechts, dan:


Heb even een stuk geselecteerd om te laten zien dat de tekst wel gerenderd wordt.

Ik snap er niets van . De achtergrond van de <pre> tag is gewoon zwart en de voorgrond wit, en het is een block element, dus hij moet dan toch gewoon in z'n geheel goed renderen?

.edit: oh wacht, hij overflowt natuurlijk. Waarom eigenlijk? Als ik de overflow regel uit table.phphighlight td pre uitzet (waardoor de overflow op auto komt te staan) gaat het wel goed.

.edit2: gefixed door de kleuren ook toe te passen op de parent div.

[ Voor 11% gewijzigd door .oisyn op 04-02-2019 23:16 ]

[crisp]

De backgroundcolor moet inderdaad op de parent; dat is deze selector:

code:

table.phphighlight td.phphighlightcode > div

[Hero of Time]

Ah, dat verklaart al wat. Maar vziw doe ik zelf niks met codeblokken die te lang zijn en dus een scrollbalk weergeven. Dat moet ik namelijk nog steeds eens toevoegen aan m'n custom css. Ik zie dus een lichtgrijze achtergrond met daarnaast wit als ik naar rechts scroll. En dat lijkt zo te zien in de 'native' Tweakers code te zitten. De parent div van de code stukje bij @crisp:

Cascading Stylesheet:

table.phphighlight td.phphighlightcode>div {
    background: #fefefe;
}

En de onderliggende <pre>:

Cascading Stylesheet:

table.phphighlight td, table.phphighlight td pre, table.phphighlight td code {
    color: #000000; 
    background: #DDDDDD;
}

[crisp]

Hero of Time schreef op maandag 4 februari 2019 @ 19:35:
[...]
En de onderliggende <pre>:

Cascading Stylesheet:

table.phphighlight td, table.phphighlight td pre, table.phphighlight td code {
    color: #000000; 
    background: #DDDDDD;
}

Ik weet niet waar je die vandaan hebt, maar dat komt in onze CSS niet (meer?) voor...

Edit: dat staat dus wel in jouw custom CSS

[ Voor 5% gewijzigd door crisp op 04-02-2019 21:29 ]

[Hero of Time]

crisp schreef op maandag 4 februari 2019 @ 21:27:
[...]

Ik weet niet waar je die vandaan hebt, maar dat komt in onze CSS niet (meer?) voor...

Edit: dat staat dus wel in jouw custom CSS

Shoot, idd. Vanaf de bank is het best lastig te lezen welke CSS het in staat. Er staat dus idd custom.css ipv wat ik dacht te lezen forum.css. Dat moet dan recentelijk aangepast zijn aan jullie kant, want tot voor kort zag ik geen verschil.

[crisp]

Hero of Time schreef op maandag 4 februari 2019 @ 21:50:
[...]

Shoot, idd. Vanaf de bank is het best lastig te lezen welke CSS het in staat. Er staat dus idd custom.css ipv wat ik dacht te lezen forum.css. Dat moet dan recentelijk aangepast zijn aan jullie kant, want tot voor kort zag ik geen verschil.

Klopt, voorlaatste release is dat aangepast. Er zaten nig allerlei inmiddels onnodige IE-workarounds in de CSS en javascript die zijn weggehaaald en de CSS is wat versimpelt.

[ACM]

Lijkt geen bug van onze css