What are the differences between inline and block elements in HTML, and how do they affect the layout of a web page?

1 Answers
Answered by suresh

```html

Differences between inline and block elements in HTML

Differences between inline and block elements in HTML

Inline elements:

  • Inline elements do not start on a new line and only take up as much width as necessary.
  • Examples of inline elements include span, a, strong, and em.

Block elements:

  • Block elements always start on a new line and take up the full width available.
  • Examples of block elements include div, p, h1-h6, and ul.

How they affect the layout of a web page:

  • Inline elements do not create a line break and can be placed next to each other on the same line.
  • Block elements create a line break before and after them, causing them to stack vertically on the page.
  • Block elements can have margins, padding, and width specified, which affects the layout of surrounding elements.

```

This HTML code provides a structured and SEO-friendly way to explain the differences between inline and block elements in HTML for the UI Developer category interview question. It includes headings, paragraphs, and lists to organize the information clearly.

Answer for Question: What are the differences between inline and block elements in HTML, and how do they affect the layout of a web page?