Why are my columns being aligned vertically instead of in 2 rows?

Question

On my website, everything had been normal, and then I changed something unrelated and all the sudden my product columns got moved all the way to the left and placed single file in a vertical line. It's supposed to be two rows of three, not 6 rows of one. Check out my code and see if you can help me figure out what went wrong.

div {
  height: 250px;
  width: 90%;
  padding: 0 10px;
}

#column1 {
  background-color: lightgrey;
  width: 30%;
}

#column2 {
  background-color: grey;
  width: 30%;
}

#column3 {
  background-color: darkgrey;
  width: 30%;
}

#column4 {
  background-color: darkgrey;
  width: 30%;
}

#column5 {
  background-color: lightgrey;
  width: 30%;
}

#column6 {
  background-color: grey;
  width: 30%;
}

<div id="column1">Single sheet 8.5"/13" printer paper $19.99
  <br/>

  <!--Paypal buttons-->

  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="example@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single sheet 8.5" /13 " printer paper">
    <input type="hidden" name="amount" value="19.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
  </form>

</div>


<div id="column2">Single sheet 8.5"/13" printer paper(pre-crumpled) $34.99
  <br/>
  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="example@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single sheet 8.5" /13 " printer paper (pre crumpled)">
    <input type="hidden" name="amount" value="34.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
  </form>
</div>


<div id="column3">Single CD-R disc, scratched $42.99
  <br/>
  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="example@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single CD-R disc, scratched">
    <input type="hidden" name="amount" value="42.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
  </form>
</div>


<div id="column4">Single square toilet paper for quarentine days $12.99
  <br/>
  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="example@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single square toilet paper for quarantine days">
    <input type="hidden" name="amount" value="12.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
  </form>
</div>


<div id="column5">Single use toothpick $6.99
  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="example@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single use toothpick">
    <input type="hidden" name="amount" value="6.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
  </form>
</div>


<div id="column6">10cm dental floss $89.99
  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="example@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="10cm dental floss">
    <input type="hidden" name="amount" value="89.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
  </form>
</div>

*NOTE: There were originally images in each box, but I removed them for security reasons.

Answer 1

there are a couple of ways to go upon this, you could use float as Jason Stephenson suggested in comments ,or put all your elements in one div and give it below properties and they'll line up in rows.

add below class in your css file:

.parent-div {
   display: flex;
   flex: wrap;
}

adding example code: wrap all of your div's inside below...

    <div class='parent-div'>
  all your code...

     </div>

hope this helps, feel free to let me know if you need further clarification, or if for some reason it doesn't work for you ...

your html:

<div id="parent-div">
    <div id="column1">Single sheet 8.5"/13" printer paper $19.99
          <br/>
          <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="dannapye@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single sheet 8.5"/13" printer paper">
    <input type="hidden" name="amount" value="19.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>

        </div>
        <div id="column2">Single sheet 8.5"/13" printer paper(pre-crumpled) $34.99
          <br/>
          <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="dannapye@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single sheet 8.5"/13" printer paper (pre crumpled)">
    <input type="hidden" name="amount" value="34.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>

        </div>
        <div id="column3">Single CD-R disc, scratched $42.99
          <br/>
          <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="dannapye@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single CD-R disc, scratched">
    <input type="hidden" name="amount" value="42.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>

        </div>

        <div id="column4">Single square toilet paper for quarentine days $12.99
          <br/>
          <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="dannapye@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single square toilet paper for quarantine days">
    <input type="hidden" name="amount" value="12.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>

        </div>
        <div id="column5">Single use toothpick $6.99
          <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="dannapye@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="Single use toothpick">
    <input type="hidden" name="amount" value="6.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>

        </div>
        <div id="column6">10cm dental floss $89.99
          <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_xclick">
    <input type="hidden" name="business" value="dannapye@gmail.com">
    <input type="hidden" name="lc" value="US">
    <input type="hidden" name="item_name" value="10cm dental floss">
    <input type="hidden" name="amount" value="89.99">
    <input type="hidden" name="currency_code" value="USD">
    <input type="hidden" name="button_subtype" value="services">
    <input type="hidden" name="no_note" value="0">
    <input type="hidden" name="tax_rate" value="10.000">
    <input type="hidden" name="shipping" value="2.99">
    <input type="hidden" name="bn" value="PP-BuyNowBF:btn_buynowCC_LG.gif:NonHostedGuest">
    <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>

       </div>

        </div>

your css:

 #parent-div{
          display: flex;
          flex: wrap;
        height:150px; 
          width:100%;
          padding:0 10px;
          }

#column1{ 
          background-color:lightgrey; 
          width:30%; 
          } 
          #column2{ 
          background-color:grey; 
          width:30%; 
          } 
          #column3{ 
          background-color:darkgrey; 
          width:30%; 
          } 
          #column4{ 
          background-color:darkgrey; 
          width:30%; 
          } 
          #column5{ 
          background-color:lightgrey; 
          width:30%; 
          } 
          #column6{ 
          background-color:grey; 
          width:30%; 
          }

Answer 2

You could use grid system also.

   body {
    display: grid;
    grid-template-columns: auto auto;
  }
div{

    height:250px; 
    width:90%!important;
    padding:0 10px;
    }
  #column1{ 
  background-color:lightgrey; 
  width:30%; 
  } 
  #column2{ 
  background-color:grey; 
  width:30%; 
  } 
  #column3{ 
  background-color:darkgrey; 
  width:30%; 
  } 
  #column4{ 
  background-color:darkgrey; 
  width:30%; 
  } 
  #column5{ 
  background-color:lightgrey; 
  width:30%; 
  } 
  #column6{ 
  background-color:grey; 
  width:30%; 
  }