I want to discuss about html and cas

How do i inline this??

We’d be happy to try to help you but we can’t do anything without seeing some code and without a full explanation of exactly what you’re trying to achieve.

I want to set checkbox and text in same line but i don’t know how to do that.

As said above we cant help you without seeing any of your codr

I’d like to link up if that’s okay with you, I’m in step 12 right now lol so I’m of no real use rn but since we are both starting, maybe we could share some ideas and motivate each other

Survey Project Form
<h1 class="title">Survey Project Form</h1>

<p class="description">Please fill out this form with the required information</p>


<form method="post" action='https://register-demo.freecodecamp.org' id="survey-form">
    
<fieldset>
       
      <legend class="question">
         Personal Info 
      </legend>
      
          <p>
              <label id="name-label">Name:</label>
              <input type="text" id="name" name="name" placeholder="Your Name" autocomplete="on" required autofocus>
          </p>
          
          <p>
          <label id="email-label">Email-Id:</label>
          <input type="email" id="email" name="email"  placeholder="Your Email" required autocomplete="on">
       
          </p>
          
          <p>
              <label id="number-label">Phone no:</label>
              
              <input type="tel" id="number" placeholder="Ex-1234567890" pattern="(0-9){5}(0-9){5}" required min="5" max="95" class="number">
          </p>
          
          <p>
              
              <label for="age">Your Age(optional):</label>
              <input type="number" id="age" placeholder="Your Age" autocomplete="on" min="14" max="120">
          </p>
          
          <p>
              
              <label for="occupation" >Your Occupation</label>
              <select name="occupation" id="occupation" class="dropdown occupation">
                  <option value="business Man">Business</option>
                      <option value="student">Student</option>
                      <option value="software-engineer">Software Engineer</option>
                      
                      
                      <option value="other">other</option>
                      </select>
                      
          </p>
          
   <hr>
   
   </fieldset> 
   
   <!-- favorite language -->
   
   <h2>Favourite language</h2>
   
   
   <fieldset>
       
   <legend class="question">Which language do you like the most?</legend>
   <p>
   <input type="radio" id="html" name="coding-language" value="html" class="option">
   <label for="html">HTML</label>
   
   <input type="radio" id="css" name="coding-language" value="css" class="option">
   <label for="css">CSS</label>
   
   <input type="radio" id="java" name="coding-language" value="java" class="option">
   <label for="java">JAVA</label>
   
       <input type="radio" id="other" name="coding-language" value="other" class="option">
   <label for="other">other</label>
   </p>
   
   <hr>
         
      </fieldset>
   
   
   <!-- hobby -->
   
   <h2>Hobby</h2>
   
   
       <fieldset>
       <legend class="question">what's your hobby? </legend>
       <p>
           <input type="checkbox" value="coding" id="coding" name="hobby" class="option">
           
         <label for="coding">Coding</label>
       </p>
       <p>
           <input type="checkbox" value="singing" id="singing" name="hobby" class="option">
         <label for="singing">Singing</label>
       </p>
       <p>
           <input type="checkbox" value="dancing" id="dancing" name="hobby" class="option">
         <label for="dancing">Dancing</label>
       </p>
       <p>
           <input type="checkbox" value="drama" id="drama" name="hobby" class="option">
         <label for="drama">Drama</label>
       </p>
       <p>
           <input type="checkbox" value="sports" id="sports" name="hobby" class="option">
         <label for="sports">sports</label>
       </p>
       <p>
           <input type="checkbox" value="studying" id="studying" name="hobby" class="option">
         <label for="studying">studying</label>
       </p>
       <p>
           <input type="checkbox" value="acting" id="acting" name="hobby" class="option">
         <label for="acting">acting</label>
       </p>
       <p>
           <input type="checkbox" value="other" id="other" name="hobby" class="option">
         <label for="other">other</label>
       </p>
       <hr>
       </fieldset>
       
       <h2>Sports</h2>
       <fieldset>
           <lable for="sport" class="question">Your Favorite Sport:
           <select id="dropdown" class="dropdown">
               
               <option>Cricket</option>
               <option>Football</option>
               <option>other</option>
           </select>
           </lable>
           <br>
           <br>
           <label for="bio" >
               
           
           <textarea id="bio" name="bio" placeholder="About you" rows="5" cols="30" ></textarea>
           </label>
           
       </fieldset>
       <p>
           <button type="submit" class="submit">Submit</button>
       </p>
 </form>

@import url(“https://fonts.googleapis.com/css2?family=Nunito&display=swap”);

*{
display:block;
box-sizing:border-box;
}
:root{
–FONT-COLOR:#000;
–ALT-FONT-COLOR:whitesmoke;

}

title{
    
    margin-left:-100000px
}


body {
font-size:1em;
font-family:"Nunito", sans-serif;

background-image:url(bg4.png);
background-size:cover;
max-height:100vh;
color:var(--FONT-COLOR);

}

form{
   display:grid;
   place-content:center;
}

hr{
    height:3px;
}

h1,.description, h2, bio{
    text-align:center;
}

.description, h1{
    color:var(--ALT-FONT-COLOR);
}


.question{
    font-weight:bold;
    text-align:center;
    
}

 .occupation{
    margin-left:0.7rem;
    }




.option{
    
      width: unset;
      margin: 0 0.5em 0 0;
      vertical-align: middle;
      color:#dfdfe2;
}

input{
    width:80vw;
    height:4vh;
}



fieldset{
    
    width: 80vw;
    border:none;
}




textarea{
    margin:auto;
    
}
.dropdown{
    
    width: 70vw;
    height: 4vh;
}




.submit{
    
    width:80vw;
    height:4vh;
    margin-left:auto;
    margin-right:auto;
}

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.