Menu icon Foundation
CSS - Replace instead of overwrite?

Through searching the forum I found information on how to override the CSS in foundation. But... I'm wondering if there is a way to replace the standard CSS as needed instead of overriding in a way that wouldn't have the code being overridden on update. The reason I'd rather replace instead of having an override is just to avoid loading unnecessary CSS code.

Any help you can give would be greatly appreciated. Thanks a million!

cssoverrideReplacecustomize

Through searching the forum I found information on how to override the CSS in foundation. But... I'm wondering if there is a way to replace the standard CSS as needed instead of overriding in a way that wouldn't have the code being overridden on update. The reason I'd rather replace instead of having an override is just to avoid loading unnecessary CSS code.

Any help you can give would be greatly appreciated. Thanks a million!

Jacob Brooks over 4 years ago

Hey Tony!

What specifics are you trying to override? The Custom download of Foundation 5 allows for some personalization (colors, added features, gutter sizes etc) which might help with some of your needs. Otherwise I would just replace what code you need in the Foundation.css file, is this possible in your case?

http://foundation.zurb.com/develop/download.html#customizeFoundation

Let me know if I can help in any other ways.

Cole Beck over 4 years ago

As mentioned above, you can download a custom build to exclude those elements which you do not need. If you use SASS, you can also easily include or exclude parts of Foundation's CSS.
If you want to replace some of the CSS Foundation uses with your own CSS, I would suggest simply editing the foundation.css (or site.css, depending) file accordingly. For example, if you want to change the size of the h1 headings I would simply go into the foundation.css and find the appropriate place to change it.

Rafi Benkual over 4 years ago

Check the best practice section here: http://foundation.zurb.com/docs/css.html

It explains how you should use Foundation and structure your files with a CSS version