Header 컴포넌트에 div 말고 애초에 button은 안 되나요?

궁금한 점이 2가지 있는데요

1. Header 컴포넌트에 div 말고 애초에 button를 넣으면 안 되나요?

Header.jsx

const Header = ({ title, leftChild, rightChild }) => {
  return (

    <header className="Header">
      <button className="header_left">{leftChild}</button>
      <div className="header_center">{title}</div>
      <button className="header_right">{rightChild}</button>
    </header>
  );
};

App.jsx

<Header title={"Header"} leftChild={"Left"} rightChild={"Right"} />

이런 식으로 헤더 컴포에 처음부터 버튼 태그를 넣으면 될 것 같은데 왜 div로 감싸는 건가요?
음.. 그냥 css 편의상 이유일까요?

2. 저는 css를 배울 때 처음에 charset "utf-8"; 을 항상 입력하라고 배웠는데 리액트 강의에서는 항상 안 사용하시더라구요. 리액트에서는 원래 안 쓰는건가요, 아니면 그냥 강의에서는 굳이 필요없어서 쓰지 않는건가요?