input para outro assunto

Fala aí Tiago, tudo bem? O ideal é que ele fique perto do select e só apareça quando a opção Outro for selecionado (isso pode ser feito com JavaScript).

Espero ter ajudado.

Oi, Matheus. Minha duvida seria mais que na atividade 05: A tag select o instrutor diz que a selecao do assunto pode ser feito com o elemento select ao inves do <input type="radio">, que seria uma forma diferente a solucao que proposta na atividade 02: Criando um formulário de contato para a selecao do assunto da mensagem de contato. Veja a proposta da atividade 02: Criando um formulário de contato:

<fieldset>
    <input type="radio" name="assunto" value="Outro" id="outro">
    <label for="outro">Outro</label>
    <input type="text" name="outro-assunto">
</fieldset>

Entao, na atividade 05: A tag select foi proposto da seguinte maneira:

<select name="assunto">
    <option value="blog">Blog</option>
    <option value="servico">Serviço</option>
    <option value="outro">Outro</option>
</select>

Nesta atividade 05: A tag select eu alterei meu codigo de acordo com a orientacao do instrutor substituindo o radio pelo select. Entretanto, o instrutor nao mostrou em sua solucao aonde iria ficar o input e na atual atividade desta aula, atividade 09: Estilizando formulários, o instrutor solicita a estilizacao para o input outro:

Os campos de texto devem ocupar a largura inteira da tela (exceto o campo para o assunto "Outro"), ter uma borda cinza clara, espaçamento interno e usar a mesma fonte do resto da página.

Por nao ter sido apresentado na atividade 05: A tag select aonde este inputdeveria ser implementando, me gerou uma confusao. Foi proposto uma solucao utilizando o select sem mostrar aonde ficaria o input para o outro assunto.

Acabou passando despercebido Tiago, mas, a ideia seria essa dai mesmo.

Pode deixar o select e ao lado o input, dai quando a opção Outro for selecionado você mostra o input que até então estava escondido.

Para fazer isso vai precisar um pouco de JavaScript para manipular o display ou classes do input.

Segue um exemplo básico para você ter uma noção:

https://jsfiddle.net/mahenrique94/o79wjt42/

Espero ter ajudado.

Oi, Matheus.

Entao, criei esta duvida porque o instrutor havia apresentado o select como alternativa e eu queria deixar o select no lugar do radio, mas a estilizacao desta atividade foi feita com base no radio. Por isso, eu fiquei em duvida aonde ficaria o input.

Entretanto, na proxima atividade Melhorando a usabilidade com truques CSS eu vi que de qualquer forma nao seria possivel deixar o formulario com select porque nao seria possivel selecionar via CSS o input de forma que pudessemos alterar seu display caso a opcao outro fosse selecionado.

Voce pode ver maior desenrolar desta historia nesta duvida que criei, mas, em resumo, o navegador renderiza o input fora do select porque o elemento select so aceita os elementos option e optgroup como filho, como descreve a documentacao:

Permitted content: Zero or more <option> or <optgroup> elements.

Por isso, a solucao para esta funcionalidade ensinada na aula Melhorando a usabilidade com truques CSS, como voce bem apresentou acima, so poderia ser feita utilizando JavaScript, o que foge do escopo da aula porque o curso foca em HTML e CSS. Entao, eu optei voltar a utilizar o radio.

Muito obrigado pela ajuda, Matheus!

Eu entendi, faz sentido sua dúvida.

A solução seria esse link que eu compartilhei contigo, mas, vai ser necessário um pouco de JavaScript.

Mas, faz sentido continuar com o radio nesse momento mesmo.

Não deixe de marcar o tópico como solucionado caso o problema tenha sido resolvido.

Abraços e bons estudos.

Oi, Matheus.

Ja marquei o topico como solucionado. Muito obrigado!