Go on. Explore!

lvl 0 • 0 xp

lvl 1

Home Market Decks Interests

CSS

memorize.ai (lvl 286)

(0)

29 cards

()

Section 1

Preview this deck

What is CSS normalizing?

Front

1 / 29

CSS Web Dev

0.0

0 reviews

5			0
4			0
3			0
2			0
1			0

Active users

All-time users

Favorites

Last updated

6 years ago

Date created

Mar 1, 2020

Cards (29)

Section 1

(29 cards)

What is CSS normalizing?

Front

A small CSS file to provide consistency across browsers

Back

Is there any reason you'd want to use translate() instead of absolute positioning?

Front

translate() uses GPU so it is more performant translate() may not work on older browsers

Back

What is position: fixed?

Front

Relative to the viewport. Stays when scrolled.

Back

What are some of the "gotchas" for writing efficient CSS?

Front

Don't use * universal selector Avoid inline CSS

Back

How would you approach fixing browser-specific styling issues?

Front

Try autoprefixer

Back

What does `* { box-sizing: border-box; }` do? What are its advantages?

Front

Defines how the width and height of an element are calculated Easier to track since height and width are based on outermost property. Default is box-sizing: content-box

Back

What are some pseudo-elements?

Front

::after ::before ::first-letter ::first-line ::selection

Back

What are the different ways to visually hide content?

Front

`display: none` does not affect layout `visibility: hidden` affects layout `opacity: 0` affects layout

Back

What is the CSS display property and can you give a few examples of its use?

Front

inline: Keeps element in flow. Only allowed to use margin/padding horizontally block: Takes element out of flow and on own line flex: Flexbox

Back

Can you give an example of an @media property other than screen?

Front

`print` for printers `speech` for speech programs

Back

What is the box-model?

Front

content > padding > border > margin

Back

What is position: sticky?

Front

Based off scroll position

Back

What is CSS resetting?

Front

A template to strip down all default CSS styles to nothing

Back

How would you implement a web design comp that uses non-standard fonts?

Front

@font-face creates new font-family @import adds new font Use CDN but download font into assets folder just in case

Back

How does a browser determines what elements match a CSS selector?

Front

Browser reads right to left so having unnecessary selectors can hit performance

Back

What is position: static?

Front

Goes with the flow. Default position

Back

What are the disadvantages of using CSS preprocessors?

Front

Difficult debugging Requires compilation Performance hit

Back

What is position: absolute?

Front

Relative to next parent with relative or absolute positioning Modified with top, bottom, right, and left properties

Back

What is a float?

Front

Says where element should be in container. Allows text and inline elements to wrap around it.

Back

What are some clearing methods?

Front

- Empty div with clear: both - Overflowing the parent - Easy clearing uses :after { clear: both }

Back

What is z-index?

Front

Property that defines stacking order. Highest value is on top.

Back

What is inline compared to inline-block?

Front

Only allows margin/padding horizontally

Back

What is the order of CSS selector specificity?

Front

Inline style > ID > Class and pseudo-class > element and pseudo-element

Back

How do you serve your pages for feature-constrained browsers?

Front

Use polyfills

Back

What is position: relative?

Front

Relative to itself Needs top, bottom, left, or right to change location Children with absolute positioning will be based off this element

Back

What are the advantages of using CSS preprocessors?

Front

Auto-prefixes Functions Nested syntax

Back

What is inline-block compared to inline?

Front

Allows all CSS properties to be modified, similar to a block

Back

what is the difference between coding a web site to be responsive versus using a mobile-first strategy?

Front

Mobile first is a design strategy Responsive is a technical implementation that means the site changes based on the size of the users screen

Back

How is CSS selector specificity calculated?

Front

Inline style: 1000 ID: 100 Class and pseudo-class: 10 element and pseudo-element: 1

Back