Home > Enterprise >  Input alignement
Input alignement

Time:03-23



            
      <section >
        <div >
          <div >
            <div >
                <h2 >Iscriviti alla nostra newsletter</h2>
            </div>
            <div >
                <form>
                  <div >
                    <div >
                      <input type="email"  id="exampleInputEmail1" aria-describedby="emailHelp">
                    </div>  
                    <div >
                      <button type="submit" >Submit</button>
                    </div>
                  </div>
                </form>
            </div>
          </div>
        </div>
      </section>

The code above displays this: https://i.stack.imgur.com/RR0H7.png

If i wanted to put the button right next to the input, how'd i have to do it?

CodePudding user response:

 <form action="">
       
   
       
       <input type="text"><span><button>submit</button></span>
    </form>
    
        //use span tag in html or in css display :inline-block

CodePudding user response:

     &nbsp; &nbsp; &nbsp; &nbsp;
      <section >
        <div >
          <div >
            <div >
                <h2 >Iscriviti alla nostra newsletter</h2>
            </div>
            <div >
                <form>
                  <div >
                    <div >
                      <input type="email"  id="exampleInputEmail1" aria-describedby="emailHelp">
                      <span><button>submit</button></span>
                    </div>  
                    
                      
                
                  </div>
                </form>
            </div>
          </div>
        </div>
      </section

CodePudding user response:

This should work You have set col into 12

I have distributed space as 9 3 across 12

              <div >
                <div >
                  <input type="email"  id="exampleInputEmail1" aria-describedby="emailHelp">
                </div>  
                <div >
                  <button type="submit" >Submit</button>
                </div>
              </div>

CodePudding user response:

Try this code:

&nbsp; &nbsp; &nbsp; &nbsp;
  <section >
    <div >
      <div >
        <div >
            <h2 >Iscriviti alla nostra newsletter</h2>
        </div>
        <div >
            <form>
              <div >
                <div >
                  <div >
                    <input type="email"  id="exampleInputEmail1" aria-describedby="emailHelp">
                  <button type="submit" >Submit</button>
                  </div>
                  
                </div>  
              </div>
            </form>
        </div>
      </div>
    </div>
  </section>
  • Related