gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Adjust css examples formatting (#26127)

Browse Source
This commit is contained in:
David Way
2018-12-13 05:03:03 +00:00
committed by Tom
parent 18d5502965
commit 012e93154b
35 changed files with 303 additions and 326 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
guide/english/css/css-display/index.md
View File

@ -6,19 +6,19 @@ title: CSS Display
The display property specifies the type of box used for an HTML element. It has 20 possible keyword values. The commonly used ones are:
```css
.none {display: none}
.block {display: block}
.inline-block {display: inline-block}
.inline {display: inline}
.flex {display: flex}
.inline-flex {display: inline-flex}
.inline-table {display: inline-table}
.table {display: table}
.inherit {display: inherit}
.initial {display: initial}
.none {display: none}
.block {display: block}
.inline-block {display: inline-block}
.inline {display: inline}
.flex {display: flex}
.inline-flex {display: inline-flex}
.inline-table {display: inline-table}
.table {display: table}
.inherit {display: inherit}
.initial {display: initial}
```
The `display:none` property can often be helpful when making a website responsive. For example, you may want to hide an element on a page as the screen size shrinks in order to compensate for the lack of space. `display: none` will not only hide the element, but all other elements on the page will behave as if that element does not exist. This is the biggest difference between this property and the `visibility: hidden` property, which hides the element but keeps all other page elements in the same place as they would appear if the hidden element was visible.
The `display:none` property can often be helpful when making a website responsive. For example, you may want to hide an element on a page as the screen size shrinks in order to compensate for the lack of space. `display: none` will not only hide the element, but all other elements on the page will behave as if that element does not exist. This is the biggest difference between this property and the `visibility: hidden` property, which hides the element but keeps all other page elements in the same place as they would appear if the hidden element was visible.
These keyword values are grouped into six categories:
@ -29,7 +29,7 @@ These keyword values are grouped into six categories:
* ```<display-internal>```
* ```<display-legacy>```
### More Information:
### More Information:
- [MDN - display](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
- [caniuse - Browser Support](http://caniuse.com/#search=display)