Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lära Working with Block-Level Elements | Section
Practice
Projects
Quizzes & Challenges
Quizzes
Challenges
/
CSS Fundamentals for React Developers - 1768407374224

bookWorking with Block-Level Elements

Block-level elements are rectangular and stack on top of each other, preventing other elements from sharing the same line. This behavior is controlled by the CSS property display: block.

Key points about block-level elements:

  • They default to display: block;
  • Their width spans the full width of the parent container;
  • Their height is determined by the content but can be customized with CSS;
  • They always start on a new line;
  • Properties like border, margin, padding, width, and height can be adjusted.

Let's explore an example where we manipulate width, height, and margin:

index.html

index.html

index.css

index.css

copy

Let's consider how we can center an element inside its parent.

index.html

index.html

index.css

index.css

copy
Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 1. Kapitel 24

Fråga AI

expand

Fråga AI

ChatGPT

Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal

bookWorking with Block-Level Elements

Svep för att visa menyn

Block-level elements are rectangular and stack on top of each other, preventing other elements from sharing the same line. This behavior is controlled by the CSS property display: block.

Key points about block-level elements:

  • They default to display: block;
  • Their width spans the full width of the parent container;
  • Their height is determined by the content but can be customized with CSS;
  • They always start on a new line;
  • Properties like border, margin, padding, width, and height can be adjusted.

Let's explore an example where we manipulate width, height, and margin:

index.html

index.html

index.css

index.css

copy

Let's consider how we can center an element inside its parent.

index.html

index.html

index.css

index.css

copy
Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 1. Kapitel 24
some-alt