@@ -99,8 +99,8 @@ html, body {
9999}
100100
101101body {
102- -webkit-align-items : center ;
103- -ms-flex-align : center ;
102+ -webkit-align-items : center ;
103+ -ms-flex-align : center ;
104104 align-items : center ;
105105 display : -webkit-flex ;
106106 display : flex ;
@@ -133,7 +133,7 @@ Use the `:not()` pseudo-class so no comma is added to the last item.
133133
134134### Select Items Using Negative ` nth-child `
135135
136- Use negative ` nth-child ` in CSS to select items 1 through n.
136+ Use negative ` nth-child ` in CSS to select items 1 through n.
137137
138138``` css
139139li {
@@ -217,7 +217,7 @@ Implement CSS-only sliders using `max-height` with overflow hidden:
217217}
218218```
219219
220- The element expands to the ` max-height ` value on hover and the slider displays as a result of the overflow.
220+ The element expands to the ` max-height ` value on hover and the slider displays as a result of the overflow.
221221
222222<sup >[ back to table of contents] ( #table-of-contents ) </sup >
223223
@@ -278,7 +278,7 @@ Now column gutters always appear evenly-spaced.
278278
279279### Use Attribute Selectors with Empty Links
280280
281- Display links when the ` <a> ` element has no text value but the ` href ` attribute has a link:
281+ Display links when the ` <a> ` element has no text value but the ` href ` attribute has a link:
282282
283283``` css
284284a [href ^= " http" ]:empty ::before {
@@ -334,7 +334,7 @@ To create a box with an intrinsic ratio, all you need to do is apply top or bott
334334}
335335
336336.container div {
337- border : 2px dashed #ddd ;
337+ border : 2px dashed #ddd ;
338338 height : 100% ;
339339 left : 0 ;
340340 position : absolute ;
@@ -353,7 +353,7 @@ Using 20% for padding makes the height of the box equal to 20% of its width. No
353353Make broken images more aesthetically-pleasing with a little bit of CSS:
354354
355355``` css
356- img {
356+ img {
357357 display : block ;
358358 font-family : Helvetica , Arial , sans-serif ;
359359 font-weight : 300 ;
@@ -368,13 +368,13 @@ img {
368368Now add pseudo-elements rules to display a user message and URL reference of the broken image:
369369
370370``` css
371- img :before {
371+ img :before {
372372 content : " We're sorry, the image below is broken :(" ;
373373 display : block ;
374374 margin-bottom : 10px ;
375375}
376376
377- img :after {
377+ img :after {
378378 content : " (url: " attr (src ) " )" ;
379379 display : block ;
380380 font-size : 12px ;
@@ -391,7 +391,7 @@ Learn more about styling for this pattern in [Ire Aderinokun](https://github.com
391391After setting the base font size at the root (` html { font-size: 16px; } ` ), set the font size for textual elements to ` em ` :
392392
393393``` css
394- h2 {
394+ h2 {
395395 font-size : 2em ;
396396}
397397
@@ -462,5 +462,6 @@ Current versions of Chrome, Firefox, Safari, Opera, Edge, and IE11.
462462
463463* [ Español] ( https://github.com/AllThingsSmitty/css-protips/tree/master/translations/es-ES )
464464* [ Français] ( https://github.com/AllThingsSmitty/css-protips/tree/master/translations/fr-FR )
465+ * [ Português do Brasil] ( https://github.com/AllThingsSmitty/css-protips/tree/master/translations/pt-BR )
465466* [ русский] ( https://github.com/AllThingsSmitty/css-protips/tree/master/translations/ru-RU )
466467* [ 简体中文] ( https://github.com/AllThingsSmitty/css-protips/tree/master/translations/zh-CN )
0 commit comments