⌨️
Web Design
  • Index
  • Front End
    • Front End Index
  • HTML/CSS/JS
    • HTML Index
      • Page layout
      • Form
      • Image Optimization
    • CSS Index
      • CSS Selectors
        • Selectors
        • Combinators
        • Attribute Selectors
        • Pseudo classes
      • CSS Cascade and Inheritance
        • Cascade
        • Inheritance
      • Specificity
      • Box Model
      • CSS Clearfix
      • Responsive Meta Tag
      • Flexbox Layout
      • Grid Layout
      • CSS Naming Rules
        • Golden Guidelines for Writing Clean CSS
        • BEM
        • Rules
      • Frameworks & Libraries
    • JS Index
      • JS loading
      • Modules
      • Js Array Common Method 1
      • Js Array Common Method 2
      • Custom attributes on the element
      • Operator
      • Parse a JSON Date in JavaScript
      • Importmap
  • Git
    • Git Index
    • Initialize a Repository
    • Top 20 Git Commands With Examples
  • UML
    • UML Class
  • React
    • Index
      • setState async issue
      • Redux
      • Axios
      • useState update in A Timeout
  • WebGL
    • WebGL Index
  • Back End
    • Back-End Index
      • Knex
      • Bookshelf
        • bookshelf install
        • Bookshelf only returns one row
      • Server side init flow
      • Install Wordpress on Ubuntu 22.04 with a LAMP Stack
  • React Native
    • React Native Index
      • Dynamically changing Image URLs in React Native
  • Expo
    • EAS build config
Powered by GitBook
On this page
  • Content Box vs Border Box
  • Setting the box-sing for all elements

Was this helpful?

  1. HTML/CSS/JS
  2. CSS Index

Box Model

PreviousSpecificityNextCSS Clearfix

Last updated 4 years ago

Was this helpful?

Content Box vs Border Box

Setting the box-sing for all elements

html{
  box-sizing: border-box;
}
*,
*:before,
*:after{
  box-sizing: inherit;
}
The Box Model
Content Box vs Border Box