I'm trying to put a form under an h1, but they're next to each other as if they were in separate columns. Here's the html:

<div >
      <div >

        <div >
        </div>

        <div >
          <div><h1>Text &#128075;</h1></div>

          <div>
            <form>
              <div >
                <label for="exampleInputEmail1">Email address</label>
                <input type="email"  id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email" />
                <small id="emailHelp" >We'll never share your email with anyone else.</small>
              </div>
              <button type="submit" >Submit</button>
            </form>
          </div>

        </div>

        <div >
        </div>

      </div>
    </div>

(I'm using bootstrap)

CodePudding user response：

I think you may need to change the flex direction of the div containing the elements in question.

CodePudding user response：

flex-direction: column;

Not sure what the bootstrap equivalent is.