Tell us what’s happening:
Describe your issue in detail here.
**Your code so far**
<h2>CatPhotoApp</h2>
<main>
<p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
<input<form><label for="indoor"><outdoor>
<input id="indoor" type="radio"<>outdoor< name="indoor-outdoor">Indoor
</label>
</main>
**Your browser information:**
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.81 Safari/537.36
Challenge: Create a Set of Radio Buttons
Link to the challenge:
primeiro, coloque as tags e nos lugares corretos. lembre-se de que todos os botões de opção etc. fazem parte do formulário (dentro dele).
em seguida, classifique o que está dentro de uma tag,
<… dentro …>
e o que se passa entre eles,
< tag > … entre … < tag >
você pode colocar as etiquetas do rótulo em uma linha separada para tornar as coisas mais claras por enquanto, por exemplo:
<label …>
<input …>
< /label>
compartilhe o código se quiser
você precisa acertar as tags e o conteúdo. algumas são tags dentro de tags.
<h2>CatPhotoApp</h2>
<main>
<p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
<input<form><label for="indoor"><outdoor>
<input id="indoor" type="radio"<>outdoor< <"indoor-outdoor" >name="indoor-outdoor">Indoor
</label>
</main>
primeiro você tem:
<input<form><label
a tag aqui não faz sentido para mim.
você deve ter todos esses botões / caixas de seleção dentro de um formulário, se bem me lembro, como este:
<form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
<input<label for="indoor"><outdoor>
<input id="indoor" type="radio"<>outdoor<<"indoor-outdoor">name="indoor-outdoor">Indoor</label>
</form>
então podemos começar a consertar suas informações de entrada …
observe que aninhamos as ‘coisas’ de entrada dentro do < form>.
agora vamos fazer o mesmo aninhando entradas dentro de nossas tags , mas vamos colocá-las em linhas diferentes para mantê-lo claro por agora…
<label …>
<input …>Indoor
< /label>
que pode ser parecido com isto: (clique abaixo para ver o spoiler)
<label for="indoor">
<input id="indoor" type="radio" name="indoor-outdoor">Indoor
</label>
mas lembre-se de que você precisa 2. do outro para ‘ao ar livre’. (for/id)
<h2>CatPhotoApp</h2>
<main>
<p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
<input<form>
<label for="indoor">
<input id="indoor" type="radio"<>outdoor< name="indoor-outdoor">Indoor
</label>
</main>
Não entendi explica melhor ? to presa nessa tarefa já tem horas :-(
darei o código correto em uma caixa de spoiler se você quiser clicar nele. mas você precisa entender quais elementos estão aninhados dentro de outro elemento e então você pode pensar sobre quais atributos os elementos precisam e por quê. (desculpe se o google não está traduzindo bem)
<form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
<label for="indoor">
<input id="indoor" type="radio" name="indoor-outdoor">Indoor
</label>
<label for="outdoor">
<input id="outdoor" type="radio" name="indoor-outdoor">Outdoor
</label>
</form>
tudo está aninhado dentro de ,
está aninhado dentro de ,
for = id,
name é para o servidor receber e armazenar dados,
etc
<h2>CatPhotoApp</h2>
<main>
<p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
<label for="indoor">
<input id="indoor" type="radio" name="indoor-outdoor">Indoor
</label>
<label for="outdoor">
<input id="outdoor" type="radio" name="indoor-outdoor">Outdoor
</label>
</main>
Ficou faltando só Cada um dos elementos do botão de opção deve ser adicionado à form
tag.
mova a tag </ form> para depois das entradas de rádio
isso é o que torna algo DENTRO do ‘form’ (aninhado)
<input id="outdoor" type="radio" </form>
E pra colocar assim ?
não consegui tu acredita falta essa parte
que não entendi e não deu não certo
<h2>CatPhotoApp</h2>
<main>
<p>Click here to view more <a href="#">cat photos</a>.</p>
<a href="#"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
<label for="indoor">
<input id="indoor" type="radio" name="indoor-outdoor">Indoor
</label>
<label for="outdoor">
<input id="outdoor" type="radio" name="indoor-outdoor">Outdoor
</label>
</main>
O codigo completo tá assim