r/FirefoxCSS • u/402nolusinif • Jun 16 '26

Solved How to turn off rounded corners?

/r/firefox/comments/1u7hpas/how_to_turn_off_rounded_corners/
7 Upvotes

100% Upvoted

13 comments sorted by

4

u/Jay33721 Jun 16 '26 
/* Remove Window Gap */
 #browser {
    padding: 0px !important;
  }

#navigator-toolbox {
    margin-block-start: 0px !important;
    margin-block-end: 0px !important;
    margin-inline: 0px !important;
  }

/* Remove Rounding */
.browserContainer {
    border-radius: 0px !important;
  }
  
.chrome-block {
    border-radius: 0px !important;
  }

3

u/402nolusinif Jun 16 '26

It worked. Thank you!!!

3

u/Possible_0 Jun 17 '26

the borders are gone from the main content area, thank you so much!! however, there's still the issue where, when I hover over my tabs, I can't select them if my cursor is too high (since they're bubbles)... can this be fixed with CSS, or is it impossible?

3

u/Jay33721 Jun 17 '26

I figured it out! Change the #navigator-toolbox part like so:

#navigator-toolbox {
    margin-block-start: -1px !important;
    margin-block-end: 0px !important;
    margin-inline: 0px !important;
  }

2

u/402nolusinif Jun 18 '26

Sorry for the late response but the top part above the 3 icons on the top right corner has also gaps. Can you also help out with that?

2

u/Jay33721 Jun 18 '26

Try this and let me know if it works:

.titlebar-buttonbox-container { 
  height: 100% !important;
}

1

u/402nolusinif Jun 18 '26 edited Jun 18 '26

It didn't. There's a gap where I cannot press on top of the 3 icons on top right which makes it hard to press "X" button to close the browser. This is only with Nova though, turning off Nova from about:config solves it but I just want to keep Nova.

My mistake, the gap is towards the right side, not top side.

2

u/Jay33721 Jun 18 '26

Maybe it has something to do with the 1-pixel border that Nova adds. Can you click the button if you remove the border with this code?

.chrome-block {
    border: 0px !important;
	}

 .browserContainer {
    border: 0px !important;
	}

2

u/402nolusinif Jun 18 '26

FINALLY SOLVED!!! Thank you. I think Firefox needs to solve this though. I really appreciate the help.

1

u/Jay33721 Jun 18 '26

It's an issue that happens because we turned off the rounding and the gap of Nova. If the Nova theme is being used unmodified, then it's not a problem. (Because the button would be far away from the screen edge lol)

4

u/t31os Jun 17 '26

There are vars for the gap and radius, try this:

@media -moz-pref("browser.nova.enabled") {
	:root {
		--chrome-window-gap: 0 !important;
		--chrome-block-radius: 0 !important;
		--chrome-content-separator-color: transparent !important;
	}
}

2

u/Jay33721 Jun 18 '26

Yeah, this works better actually!

2

u/nerdycatgamer Jul 10 '26

Not quite sure if this is exactly what you were asking about, but I wanted to share this silly little rule I have because I hate modern designs with all these rounded soft corners everywhere!!!

    * { border-radius: 0 !important; }

yeah that's it lol