What fresh hell is THIS now? - Patrick Lauke
@sarbbottam there is no need to use display:inline-block
on absolutely positioned elements.
As a side note, why not plugging a simple rule instead of adding stuff to the DOM?
Something like this may be?
:focus { outline: 3px solid teal !important; }
My suggestion would be to create a page with the script so people can see/check how things work.
@MichielBijl in my opinion there are many reasons why we should avoid "tying CSS to DOM structure / elements”:
type
, other via class
, other is a mix of both, etc.). That creates more “specificity war” than using id
(I’m serious)
button
rule or to add to the button
rule. So better to start with the minimum styles for buttons (the job for a base style sheet) and use classes from there (to style that element within the same specificity scope).
As a side note, Tim Baxter’s article demonstrates my first point as he uses <p>
in a form thinking it is the only valid choice a dev would have [sic] and he also uses aria-expanded
on the wrong node. Meaning the rules he wrote in that article would have to be re-written after he corrects the markup of his own examples.
display-inline
retained from continuous modification, thanks for pointing that. outline
did not work for all the time, as suggested by you outline with -ve offset did work but impacts the readability