html 메뉴 만들 때

<nav>
  <ul class="nav-main">
      <li><a href="/">홈</a></li>
      <li><a href="#">메뉴</a>
          <ul class="nav-sub">
            <li><a href="#">서브메뉴</a></li>
            <li><a href="#">서브메뉴</a></li>
            <li><a href="#">서브메뉴</a></li>
          </ul>
      </li>
      <li><a href="#">메뉴</a>
          <ul class="nav-sub">
            <li><a href="#">서브메뉴</a></li>
            <li><a href="#">서브메뉴</a></li>
            <li><a href="#">서브메뉴</a></li>
          </ul>
      </li>
      <li><a href="#">메뉴</a>
          <ul class="nav-sub">
            <li><a href="#">서브메뉴</a></li>
            <li><a href="#">서브메뉴</a></li>
            <li><a href="#">서브메뉴</a></li>
          </ul>
      </li>
      <li><a href="#">메뉴</a>
          <ul class="nav-sub">
            <li><a href="#">서브메뉴</a></li>
            <li><a href="#">서브메뉴</a></li>
            <li><a href="#">서브메뉴</a></li>
          </ul>
      </li>
  </ul>
</nav>

nav>ul>li {display:flex;}

이렇게 하면 가로정렬이 됨

 

티스토리는 자체 지정 선택자를 쓰니까 내부구조가 어케되는지 모르겠는데 일단 웹사이트 구조 만들 때는 이렇게 함...