사람인 채용공고 css 적용기

사람인 채용공고도 html로 제작이 가능하다고 합니다.
그래서 보니까 호스팅 된 서버에 채용 공고 이미지를 올려서 img 태그를 이용해서 올리는 방법이 있더라고요

<div class="wrapper"><img src="채용 이미지 url 삽입" style="
    width: 100%;
">

위의 방법으로 이미지 태그로 올릴 수 있습니다.
그리고 따로 버튼도 하나 만들어야 해서 보니까 일반 html로 웹 만들듯이 태그 사용하면 되더라고요
방법은 아래와 같이 진행하면 됩니다.

<style>
    .wrapper {
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .btn.지원하기{
      text-decoration: none;
      font-size:1rem;
      background-color: #E63D43;
      color:white;
      padding:10px 20px 10px 20px;
      margin: 20px auto;
      width: 80px;
      display:block;
      text-align: center;
     border-radius:10px;
    }
  </style>



<div class="wrapper"><img src="채용 이미지 url 삽입" style="
    width: 100%;
">
<a class="btn 지원하기" href="채용 사이트 url 삽입" target="_blank" >지원하기</a></div>

이렇게 하면 버튼이 만들어집니다.
허나....
pc 미리보기에는 적용이 안되고 mobile 미리보기에서만 적용이 되는 문제가 있더라고요
그래서 하다하다 한번 태그 안에 직접 스타일 요소들을 적용시켰습니다.

<a class="btn 지원하기" href="채용 사이트 url 삽입" target="_blank" style="
  text-decoration: none;
      font-size:1rem;
      background-color: #E63D43;
      color:white;
      padding:10px 20px 10px 20px;
      margin: 20px auto;
      width: 80px;
      display:block;
      text-align: center;
     border-radius:10px;"
>지원하기</a></div>

이렇게 적용을 시켰습니다.

혹시 이렇게 이중으로 스타일 요소를 넣은 방법 말고 다른 방법 아시는 분 있으시면 댓글로 좀 남겨주세요 정말 궁금하네요