Search code examples
csssassbulma

Bulma CSS has a navbar with a -12px margin right

I cannot seem to override a class from Bulma CSS that I'm using :

This is the class present in components/navbar.sass in bulma which I would like to override

    .navbar-menu
  margin-right: -.75rem

https://codesandbox.io/s/fcs-16lpy I'm trying to put the margin-right to 0 so I can actually have my 12 pixels back so it can be centered but it doesn't seem to work.

You can see the margin-right with 12 pixels on the box bottom right You can see the margin-right with 12 pixels on the box bottom right, if I get 0 pixel there my menu is centered.

How do I override it ?

Note: In my example, responsive for the navbar doesn't work, you have to extend it, or go directly there : https://16lpy.sse.codesandbox.io/

Solution

  • Found myself what was not working. If you want to override, you have to type !important on your sass line so it can actually override. Thank you all for your answers, they were really helpful.