Buttons and containers look .. weird on Firefox and Chrome

[DRA6N]

I copied the example from the NES.css site

This is what they look like:

As for containers, how do I put the titled to the left, rather than it centered - like the example on the site

[calthies4]

I was running into a similar issue - I tracked it down to this:

@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution:0.001dpcm){.nes-btn{border-image-repeat:space}}

Obviously this was added for a reason, but it only seems to mess up the buttons in firefox/chrome. I removed that code from my copy of the .css and the button borders look as they should.

[withhawaii]

@calthies4 Thanks for finding the root cause of this issue!
I added the following code to my css to override border-image-repeat property.

@media (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm) {
  .nes-btn {
    border-image-repeat: stretch;
  }
}

[sonicer105]

Not sure if it's related, but the rounded boxes are very broken for me.

Chrome Ver. 138.0.7204.92 (Official Build) (64-bit):

Firefox Ver. 140.0.4 (64-bit):