Na aula a professora falou que para deixar tanto o input quanto o button um de baixo do outro teremos que utilizar o "w-full" em cada um, mas ao invés de fazer isso, eu poderia criar uma classe para a form e utilizar o Flex-Box?
Segue o trecho de código que a professora passou:
<form>
<label class="text-sm font-bold text-gray-700" for="email">Email</label>
<input class="text-sm w-full" id="email" type="email" placeholder="Digite seu endereço de email">
<button class="font-bold text-white bg-azul-escuro w-full" type="button">Inscreva-se</button>
</form>
Aqui ela utiliza o "w-full" para os elementos ocuparem 100% do espaço e ficar um de abaixo do outro, mas tentei fazer por conta própria e cheguei no seguinte resultado:
<form class="flex flex-col">
<label class="text-sm font-bold text-gray-700" for="email">Email</label>
<input class="text-sm" id="email" type="email" placeholder="Digite seu endereço de email">
<button class="font-bold text-white bg-azul-escuro" type="button">Inscreva-se</button>
</form>
Desse jeito eu não utilizei o "w-full" mas sim criei uma classe para a "form" e apliquei os efeitos usando o "flex" e "flex-col". Está errado ou posso fazer desse jeito também?