Tabindex problem

HTML-CSS
1

Tell us what’s happening:

what’s wrong with my code
Your code so far



<head>
<style>
p:focus {
  background-color: yellow;
}
</style>
</head>
<body>
<header>
  <h1>Ninja Survey</h1>
</header>
<section>
  <form>


<p tabindex="0">             Instructions: Fill in ALL your information then click <b>Submit</b></p>


    <label for="username">Username:</label>
    <input type="text" id="username" name="username"><br>
    <fieldset>
      <legend>What level ninja are you?</legend>
      <input id="newbie" type="radio" name="levels" value="newbie">
      <label for="newbie">Newbie Kitten</label><br>
      <input id="intermediate" type="radio" name="levels" value="intermediate">
      <label for="intermediate">Developing Student</label><br>
      <input id="master" type="radio" name="levels" value="master">
      <label for="master">9th Life Master</label>
    </fieldset>
    <br>
    <fieldset>
    <legend>Select your favorite weapons:</legend>
    <input id="stars" type="checkbox" name="weapons" value="stars">
    <label for="stars">Throwing Stars</label><br>
    <input id="nunchucks" type="checkbox" name="weapons" value="nunchucks">
    <label for="nunchucks">Nunchucks</label><br>
    <input id="sai" type="checkbox" name="weapons" value="sai">
    <label for="sai">Sai Set</label><br>
    <input id="sword" type="checkbox" name="weapons" value="sword">
    <label for="sword">Sword</label>
    </fieldset>
    <br>
    <input type="submit" name="submit" value="Submit">
  </form><br>
</section>
<footer>&copy; 2018 Camper Cat</footer>
</body>

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36.

Challenge: Use tabindex to Add Keyboard Focus to an Element

Link to the challenge:

2

solution

<head>
  <style>
  p:focus {
    background-color: yellow;
  }
  </style>
</head>
<body>
  <header>
    <h1>Ninja Survey</h1>
  </header>
  <section>
    <form>
      
      
      <p tabindex="0">Instructions: Fill in ALL your information then click <b>Submit</b></p>
      
      
      <label for="username">Username:</label>
      <input type="text" id="username" name="username"><br>
      <fieldset>
        <legend>What level ninja are you?</legend>
        <input id="newbie" type="radio" name="levels" value="newbie">
        <label for="newbie">Newbie Kitten</label><br>
        <input id="intermediate" type="radio" name="levels" value="intermediate">
        <label for="intermediate">Developing Student</label><br>
        <input id="master" type="radio" name="levels" value="master">
        <label for="master">9th Life Master</label>
      </fieldset>
      <br>
      <fieldset>
      <legend>Select your favorite weapons:</legend>
      <input id="stars" type="checkbox" name="weapons" value="stars">
      <label for="stars">Throwing Stars</label><br>
      <input id="nunchucks" type="checkbox" name="weapons" value="nunchucks">
      <label for="nunchucks">Nunchucks</label><br>
      <input id="sai" type="checkbox" name="weapons" value="sai">
      <label for="sai">Sai Set</label><br>
      <input id="sword" type="checkbox" name="weapons" value="sword">
      <label for="sword">Sword</label>
      </fieldset>
      <br>
      <input type="submit" name="submit" value="Submit">
    </form><br>
  </section>
  <footer>&copy; 2016 Camper Cat</footer>
</body>
3

Hello @lalithakash5

It is great that you solved the challenge, but instead of posting your full working solution, it is best to stay focused on answering the original poster’s question(s) and help guide them with hints and suggestions to solve their own issues with the challenge.

We are trying to cut back on the number of spoiler solutions found on the forum and instead focus on helping other campers with their questions and definitely not posting full working solutions.

You can post solutions that invite discussion (like asking how the solution works, or asking about certain parts of the solution). But please don’t just post your solution for the sake of sharing it.
If you post a full passing solution to a challenge and have questions about it, please surround it with [spoiler] and [/spoiler] tags on the line above and below your solution code.

4

@sarvepallideepak

your code passes for me, make sure your browser is updated to last version, and that you do not have any extension interfering with the tests