Recentemente ho aggiornato il mio Chrome alla v48 e mi sono imbattuto in un bug strano. Così ho una piuttosto semplice markup con un tag <pre> con alcuni stili di baseChrome 48 aggiunge una barra di scorrimento se il raggio del bordo [OSX]
pre {
border: 1px solid #dedede;
overflow: auto;
width: 90%;
margin: auto;
margin-top: 20px;
border-radius: 3px;
background-color: #f7f7f7;
}
Ora il problema è, se uso border-radius per pre tag, Chrome mostra con forza barra di scorrimento orizzontale. Se rimuovo la proprietà border-radius, la barra orizzontale scomparirà e riapparirà sullo scroll come previsto.
Demo 2(comportamento corretto, ma solo se rimuovo border-radius [per gli utenti Mac])
Giusto per chiarire che sono su Mac OSX di Yosemite, in modo da barre di scorrimento non sono mostrato fino a quando non inizi a scorrere (non sono sicuro che Windows faccia la stessa cosa, sono sicuro che non lo faccia).
Dettagli aggiuntivi:
Mac Pro Retina
OS: OSX Yosemite v10.10.5
Chrome Ver: 48.0.2564.97 (64-bit)
Quindi, la domanda è: perché Chrome forza la barra di scorrimento se io uso border-radius e come posso recuperare la vecchia funzionalità dove era usata per mostrare le barre di scorrimento solo se l'utente inizia a scorrere. Questo fa anche confusione con i menu a discesa che ho sopra il pre-tag e le barre di scorrimento che si sovrappongono anche a quei menu se li espandi, ma questo è appena fuori contesto per questa domanda.
Su 47 e 49 (canarino) la barra di scorrimento mostra sempre per me con o senza raggio di confine se ha bisogno di overflow (osx El Capitan) –
Questo comportamento non compare nelle versioni di Chrome '48.0.2564.82 m' o' 48.0. 2564.97' su Windows 7. Suppongo che sia probabilmente un comportamento visivo specifico per OSX Yosemite (10.10) – TylerH
@DominicTobias Utilizzato per funzionare correttamente su 47, questo problema è specifico di 48. –