How to style the fieldset tag using id attribute?

Asked

Viewed 223 times

1

I’m trying to put a {background-color: aqua;} on the tag fieldset, using id="003" and addressing the style to the external file .CSS. But no change is happening. When I write to the HTML file: fieldset style="background-color:aqua;" ai works. But it should be working the way I wrote below too.

<--! In HTML file: line 2 -->

<form action="/formulario.html" target="_blank">
     <fieldset id="003">
        <legend>Formulario Agrupado:</legend>
        Email:<br/>
        <input name="email" type="text"/><br/>
        Senha:<br/>
        <input name="senha" type="password"><br/>
        Idade:<br/>
        <select>
           <option>opção 01</option>
           <option>opção 02</option>
           <option>opção 03</option>
        </select><br/><br/>
        Sexo:<input type="radio" name="sexo" value="m"/> Masculino
        <input type="radio" name="sexo" value="f"/> Feminino<br/>
        Redes Sociais:<br/>
        <input type="checkbox" name="redes" value="facebook"/> Facebook
        <input type="checkbox" name="redes" value="google"/> Google<br/>
        <input type="submit" value="Submit">
        <input type="reset" value="Limpar">
     </fieldset>
  </form>

<--! In the CSS file: -->

#003{background-color: aqua;}
  • Id cannot start with a number.

  • Recommended reading https://answall.com/questions/253484/%C3%89-a-m%C3%A1-pr%C3%A1tica-colocar-n%C3%Bameros-como-id-em-elementos-html-se-sim-por-qu%C3%AA? Rq=1

1 answer

1


See what it says to documentation on the MDN about the attribute id:

Note: Using characters other than letters and ASCII digits, '_', '-' and '.' can cause compatibility problems since they were not allowed in HTML 4. Although this restriction was suspended in HTML 5, an ID must start with a letter for compatibility purposes.

That is, a id should start with a letter. In your case it is starting with a number.

Adding any letter to the beginning of your id, will work. see:

#a003{background-color: aqua;}
<form action="/formulario.html" target="_blank">
     <fieldset id="a003">
        <legend>Formulario Agrupado:</legend>
        Email:<br/>
        <input name="email" type="text"/><br/>
        Senha:<br/>
        <input name="senha" type="password"><br/>
        Idade:<br/>
        <select>
           <option>opção 01</option>
           <option>opção 02</option>
           <option>opção 03</option>
        </select><br/><br/>
        Sexo:<input type="radio" name="sexo" value="m"/> Masculino
        <input type="radio" name="sexo" value="f"/> Feminino<br/>
        Redes Sociais:<br/>
        <input type="checkbox" name="redes" value="facebook"/> Facebook
        <input type="checkbox" name="redes" value="google"/> Google<br/>
        <input type="submit" value="Submit">
        <input type="reset" value="Limpar">
     </fieldset>
  </form>

  • got it. Sloppiness of my part with a silly error of that rs. It worked now, thanks for the help !

Browser other questions tagged

You are not signed in. Login or sign up in order to post.