https://github.com/giorgioreale/tabularasa

Streamlined CSS reset for consistent cross-browser design control.
https://github.com/giorgioreale/tabularasa

css css-reset

Last synced: 15 days ago
JSON representation

Streamlined CSS reset for consistent cross-browser design control.

• Host: GitHub
• URL: https://github.com/giorgioreale/tabularasa
• Owner: GiorgioReale
• License: mit
• Created: 2023-05-04T17:03:38.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2023-05-10T20:51:57.000Z (over 1 year ago)
• Last Synced: 2025-01-19T05:12:38.693Z (19 days ago)
• Topics: css, css-reset
• Language: CSS
• Homepage:
• Size: 2.93 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# TabulaRasa: A CSS Reset Stylesheet

TabulaRasa is a CSS reset stylesheet designed to provide a consistent starting point for your web projects by removing default styling and ensuring cross-browser compatibility. This allows you to take control of your design and apply your desired styles without any unwanted surprises.

## Details

TabulaRasa tackles several aspects of CSS resetting, including:

- Box-sizing: By setting `box-sizing: border-box` on all elements, TabulaRasa ensures that the dimensions of an element include padding and border, making it easier to control the layout.

- Typography: The reset stylesheet normalizes font sizes, line heights, and font weights for headings and other text elements. It also removes default margins and paddings.

- Lists: TabulaRasa removes list styles, such as bullets and numbers, and sets default margins and paddings to zero.

- Forms: The reset addresses form elements like buttons, inputs, and textareas by removing default appearances, borders, and background colors. It also sets consistent font and text styles for form elements.

- Table elements: TabulaRasa ensures a consistent appearance for tables by collapsing borders, setting default border colors, and removing default padding and margins.

In addition to these resets, TabulaRasa also includes a few accessibility improvements, such as setting `cursor: pointer` for buttons and ensuring focus styles are visible.

## How to use TabulaRasa

To use TabulaRasa in your web project, follow these steps:

1. Download the `tabularasa.css` file from this repository.

2. Add the following line to the `` section of your HTML file:

```html

```

Make sure to replace `path/to/` with the correct path to the `tabularasa.css` file in your project directory.

3. Add your custom CSS styles after the `tabularasa.css` link in your HTML file, like this:

```html

```

By doing this, your custom styles will override the reset styles provided by TabulaRasa.

## Browser Support

TabulaRasa has been tested and is compatible with the following browsers and their respective versions:

| Browser                      | Support | Minimum supported version |

| ---------------------------- | ------- | ------------------------- |

| Google Chrome                | ✅      | 49+                       |

| Mozilla Firefox              | ✅      | 45+                       |

| Microsoft Edge               | ✅      | 12+                       |

| Apple Safari                 | ✅      | 9.1+                      |

| Opera                        | ✅      | 36+                       |

| Microsoft Internet Explorer  | ❌      |                           |

Please note that while TabulaRasa aims to provide a consistent starting point for web projects, there may still be minor differences between browsers due to their specific implementations. It is always recommended to thoroughly test your project on various browsers and devices to ensure a smooth user experience.