How to align div horizontally in a row using Bootstrap









up vote
-1
down vote

favorite












I am trying to divide a page into two parts i.e. 6 + 6 columns and put 3 divs horizontally in each part. Divs exceeding 3 align in bottom row in same part of page.



I am trying but still not able to align correctly. Here is my code. How can I do this?






<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<div class="row" id="meta-search">

 <div class="col-sm-6">
 <h5> IDs </h5>
 <form action="" method="post">

 <div class="col-sm-2 mb-3">
 <label>ID1</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID2</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID3</label>
 <input type="number" class="form-control">
 </div>

 <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

 </form>
 </div>

</div>








html bootstrap-4







share|improve this question























  • Each element is relative to the parent; a col-sm-6 will be 50%, but the col-sm-2 inside it will be approx. 16% of the 50%, or 8% of the total width.
    – davewoodhall
    Nov 11 at 18:13










  • But these are not aligning horizontally but vertically. 16+16+16 = 48, so a 4th one with this ratio should go into next row. But this is not happening. This is how I am thinking.
    – XCeptable
    Nov 11 at 18:16






  • 1




    Take a look at this fiddle: jsfiddle.net/6d09q3ru --- in bootstrap 4, simply calling the "col" class will give elements the same widths,; they must however be in a row.
    – davewoodhall
    Nov 11 at 18:23










  • yes col does automatic width calculations and fits accordingly, recently came around it, when I had to make 5 cols within a row.
    – Nikhil Kinkar
    Nov 11 at 18:28














up vote
-1
down vote

favorite












I am trying to divide a page into two parts i.e. 6 + 6 columns and put 3 divs horizontally in each part. Divs exceeding 3 align in bottom row in same part of page.



I am trying but still not able to align correctly. Here is my code. How can I do this?






<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<div class="row" id="meta-search">

 <div class="col-sm-6">
 <h5> IDs </h5>
 <form action="" method="post">

 <div class="col-sm-2 mb-3">
 <label>ID1</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID2</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID3</label>
 <input type="number" class="form-control">
 </div>

 <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

 </form>
 </div>

</div>








html bootstrap-4







share|improve this question























  • Each element is relative to the parent; a col-sm-6 will be 50%, but the col-sm-2 inside it will be approx. 16% of the 50%, or 8% of the total width.
    – davewoodhall
    Nov 11 at 18:13










  • But these are not aligning horizontally but vertically. 16+16+16 = 48, so a 4th one with this ratio should go into next row. But this is not happening. This is how I am thinking.
    – XCeptable
    Nov 11 at 18:16






  • 1




    Take a look at this fiddle: jsfiddle.net/6d09q3ru --- in bootstrap 4, simply calling the "col" class will give elements the same widths,; they must however be in a row.
    – davewoodhall
    Nov 11 at 18:23










  • yes col does automatic width calculations and fits accordingly, recently came around it, when I had to make 5 cols within a row.
    – Nikhil Kinkar
    Nov 11 at 18:28












up vote
-1
down vote

favorite









up vote
-1
down vote

favorite











I am trying to divide a page into two parts i.e. 6 + 6 columns and put 3 divs horizontally in each part. Divs exceeding 3 align in bottom row in same part of page.



I am trying but still not able to align correctly. Here is my code. How can I do this?






<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<div class="row" id="meta-search">

 <div class="col-sm-6">
 <h5> IDs </h5>
 <form action="" method="post">

 <div class="col-sm-2 mb-3">
 <label>ID1</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID2</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID3</label>
 <input type="number" class="form-control">
 </div>

 <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

 </form>
 </div>

</div>








html bootstrap-4







share|improve this question















I am trying to divide a page into two parts i.e. 6 + 6 columns and put 3 divs horizontally in each part. Divs exceeding 3 align in bottom row in same part of page.



I am trying but still not able to align correctly. Here is my code. How can I do this?






<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<div class="row" id="meta-search">

 <div class="col-sm-6">
 <h5> IDs </h5>
 <form action="" method="post">

 <div class="col-sm-2 mb-3">
 <label>ID1</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID2</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID3</label>
 <input type="number" class="form-control">
 </div>

 <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

 </form>
 </div>

</div>








<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<div class="row" id="meta-search">

 <div class="col-sm-6">
 <h5> IDs </h5>
 <form action="" method="post">

 <div class="col-sm-2 mb-3">
 <label>ID1</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID2</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID3</label>
 <input type="number" class="form-control">
 </div>

 <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

 </form>
 </div>

</div>





<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<div class="row" id="meta-search">

 <div class="col-sm-6">
 <h5> IDs </h5>
 <form action="" method="post">

 <div class="col-sm-2 mb-3">
 <label>ID1</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID2</label>
 <input type="number" class="form-control">
 </div>

 <div class="col-sm-2 mb-3">
 <label>ID3</label>
 <input type="number" class="form-control">
 </div>

 <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

 </form>
 </div>

</div>





html bootstrap-4




html bootstrap-4






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 11 at 18:17









Smollet777

1,140915




1,140915










asked Nov 11 at 18:10









XCeptable

59141434




59141434











  • Each element is relative to the parent; a col-sm-6 will be 50%, but the col-sm-2 inside it will be approx. 16% of the 50%, or 8% of the total width.
    – davewoodhall
    Nov 11 at 18:13










  • But these are not aligning horizontally but vertically. 16+16+16 = 48, so a 4th one with this ratio should go into next row. But this is not happening. This is how I am thinking.
    – XCeptable
    Nov 11 at 18:16






  • 1




    Take a look at this fiddle: jsfiddle.net/6d09q3ru --- in bootstrap 4, simply calling the "col" class will give elements the same widths,; they must however be in a row.
    – davewoodhall
    Nov 11 at 18:23










  • yes col does automatic width calculations and fits accordingly, recently came around it, when I had to make 5 cols within a row.
    – Nikhil Kinkar
    Nov 11 at 18:28
















  • Each element is relative to the parent; a col-sm-6 will be 50%, but the col-sm-2 inside it will be approx. 16% of the 50%, or 8% of the total width.
    – davewoodhall
    Nov 11 at 18:13










  • But these are not aligning horizontally but vertically. 16+16+16 = 48, so a 4th one with this ratio should go into next row. But this is not happening. This is how I am thinking.
    – XCeptable
    Nov 11 at 18:16






  • 1




    Take a look at this fiddle: jsfiddle.net/6d09q3ru --- in bootstrap 4, simply calling the "col" class will give elements the same widths,; they must however be in a row.
    – davewoodhall
    Nov 11 at 18:23










  • yes col does automatic width calculations and fits accordingly, recently came around it, when I had to make 5 cols within a row.
    – Nikhil Kinkar
    Nov 11 at 18:28















Each element is relative to the parent; a col-sm-6 will be 50%, but the col-sm-2 inside it will be approx. 16% of the 50%, or 8% of the total width.
– davewoodhall
Nov 11 at 18:13




Each element is relative to the parent; a col-sm-6 will be 50%, but the col-sm-2 inside it will be approx. 16% of the 50%, or 8% of the total width.
– davewoodhall
Nov 11 at 18:13












But these are not aligning horizontally but vertically. 16+16+16 = 48, so a 4th one with this ratio should go into next row. But this is not happening. This is how I am thinking.
– XCeptable
Nov 11 at 18:16




But these are not aligning horizontally but vertically. 16+16+16 = 48, so a 4th one with this ratio should go into next row. But this is not happening. This is how I am thinking.
– XCeptable
Nov 11 at 18:16




1




1




Take a look at this fiddle: jsfiddle.net/6d09q3ru --- in bootstrap 4, simply calling the "col" class will give elements the same widths,; they must however be in a row.
– davewoodhall
Nov 11 at 18:23




Take a look at this fiddle: jsfiddle.net/6d09q3ru --- in bootstrap 4, simply calling the "col" class will give elements the same widths,; they must however be in a row.
– davewoodhall
Nov 11 at 18:23












yes col does automatic width calculations and fits accordingly, recently came around it, when I had to make 5 cols within a row.
– Nikhil Kinkar
Nov 11 at 18:28




yes col does automatic width calculations and fits accordingly, recently came around it, when I had to make 5 cols within a row.
– Nikhil Kinkar
Nov 11 at 18:28












2 Answers
2






active

oldest

votes

















up vote
1
down vote



accepted










You are missing another inside the tag.
Just add this 



 <form action="" method="post"> 
 <div class="row">





share|improve this answer



























    up vote
    1
    down vote













    the class col in bootstrap does it, you need to add a row class div for it, within the row you put the col divs, bootstrap calculates the width accordingly depending on number of cols you put within row div.






    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <div class="row" id="meta-search">

     <div class="col-sm-6">
     <h5> IDs </h5>
     <form action="" method="post">
     <div class="row">
     <div class="col mb-3">
     <label>ID1</label>
     <input type="number" class="form-control">
     </div>

     <div class="col mb-3">
     <label>ID2</label>
     <input type="number" class="form-control">
     </div>

     <div class="col mb-3">
     <label>ID3</label>
     <input type="number" class="form-control">
     </div>
     </div>
     <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

     </form>
     </div>

    </div>








    share|improve this answer




















      Your Answer






      StackExchange.ifUsing("editor", function ()
      StackExchange.using("externalEditor", function ()
      StackExchange.using("snippets", function ()
      StackExchange.snippets.init();
      );
      );
      , "code-snippets");

      StackExchange.ready(function()
      var channelOptions =
      tags: "".split(" "),
      id: "1"
      ;
      initTagRenderer("".split(" "), "".split(" "), channelOptions);

      StackExchange.using("externalEditor", function()
      // Have to fire editor after snippets, if snippets enabled
      if (StackExchange.settings.snippets.snippetsEnabled)
      StackExchange.using("snippets", function()
      createEditor();
      );

      else
      createEditor();

      );

      function createEditor()
      StackExchange.prepareEditor(
      heartbeatType: 'answer',
      convertImagesToLinks: true,
      noModals: true,
      showLowRepImageUploadWarning: true,
      reputationToPostImages: 10,
      bindNavPrevention: true,
      postfix: "",
      imageUploader:
      brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
      contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
      allowUrls: true
      ,
      onDemand: true,
      discardSelector: ".discard-answer"
      ,immediatelyShowMarkdownHelp:true
      );



      );













      draft saved

      draft discarded


















      StackExchange.ready(
      function ()
      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53251699%2fhow-to-align-div-horizontally-in-a-row-using-bootstrap%23new-answer', 'question_page');

      );

      Post as a guest















      Required, but never shown

























      2 Answers
      2






      active

      oldest

      votes








      2 Answers
      2






      active

      oldest

      votes









      active

      oldest

      votes






      active

      oldest

      votes








      up vote
      1
      down vote



      accepted










      You are missing another inside the tag.
      Just add this 



       <form action="" method="post"> 
       <div class="row">





      share|improve this answer
























        up vote
        1
        down vote



        accepted










        You are missing another inside the tag.
        Just add this 



         <form action="" method="post"> 
         <div class="row">





        share|improve this answer






















          up vote
          1
          down vote



          accepted







          up vote
          1
          down vote



          accepted






          You are missing another inside the tag.
          Just add this 



           <form action="" method="post"> 
           <div class="row">





          share|improve this answer












          You are missing another inside the tag.
          Just add this 



           <form action="" method="post"> 
           <div class="row">






          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Nov 11 at 18:21









          Kira

          714




          714






















              up vote
              1
              down vote













              the class col in bootstrap does it, you need to add a row class div for it, within the row you put the col divs, bootstrap calculates the width accordingly depending on number of cols you put within row div.






              <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
              <div class="row" id="meta-search">

               <div class="col-sm-6">
               <h5> IDs </h5>
               <form action="" method="post">
               <div class="row">
               <div class="col mb-3">
               <label>ID1</label>
               <input type="number" class="form-control">
               </div>

               <div class="col mb-3">
               <label>ID2</label>
               <input type="number" class="form-control">
               </div>

               <div class="col mb-3">
               <label>ID3</label>
               <input type="number" class="form-control">
               </div>
               </div>
               <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

               </form>
               </div>

              </div>








              share|improve this answer
























                up vote
                1
                down vote













                the class col in bootstrap does it, you need to add a row class div for it, within the row you put the col divs, bootstrap calculates the width accordingly depending on number of cols you put within row div.






                <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
                <div class="row" id="meta-search">

                 <div class="col-sm-6">
                 <h5> IDs </h5>
                 <form action="" method="post">
                 <div class="row">
                 <div class="col mb-3">
                 <label>ID1</label>
                 <input type="number" class="form-control">
                 </div>

                 <div class="col mb-3">
                 <label>ID2</label>
                 <input type="number" class="form-control">
                 </div>

                 <div class="col mb-3">
                 <label>ID3</label>
                 <input type="number" class="form-control">
                 </div>
                 </div>
                 <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

                 </form>
                 </div>

                </div>








                share|improve this answer






















                  up vote
                  1
                  down vote










                  up vote
                  1
                  down vote









                  the class col in bootstrap does it, you need to add a row class div for it, within the row you put the col divs, bootstrap calculates the width accordingly depending on number of cols you put within row div.






                  <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
                  <div class="row" id="meta-search">

                   <div class="col-sm-6">
                   <h5> IDs </h5>
                   <form action="" method="post">
                   <div class="row">
                   <div class="col mb-3">
                   <label>ID1</label>
                   <input type="number" class="form-control">
                   </div>

                   <div class="col mb-3">
                   <label>ID2</label>
                   <input type="number" class="form-control">
                   </div>

                   <div class="col mb-3">
                   <label>ID3</label>
                   <input type="number" class="form-control">
                   </div>
                   </div>
                   <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

                   </form>
                   </div>

                  </div>








                  share|improve this answer












                  the class col in bootstrap does it, you need to add a row class div for it, within the row you put the col divs, bootstrap calculates the width accordingly depending on number of cols you put within row div.






                  <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
                  <div class="row" id="meta-search">

                   <div class="col-sm-6">
                   <h5> IDs </h5>
                   <form action="" method="post">
                   <div class="row">
                   <div class="col mb-3">
                   <label>ID1</label>
                   <input type="number" class="form-control">
                   </div>

                   <div class="col mb-3">
                   <label>ID2</label>
                   <input type="number" class="form-control">
                   </div>

                   <div class="col mb-3">
                   <label>ID3</label>
                   <input type="number" class="form-control">
                   </div>
                   </div>
                   <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

                   </form>
                   </div>

                  </div>








                  <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
                  <div class="row" id="meta-search">

                   <div class="col-sm-6">
                   <h5> IDs </h5>
                   <form action="" method="post">
                   <div class="row">
                   <div class="col mb-3">
                   <label>ID1</label>
                   <input type="number" class="form-control">
                   </div>

                   <div class="col mb-3">
                   <label>ID2</label>
                   <input type="number" class="form-control">
                   </div>

                   <div class="col mb-3">
                   <label>ID3</label>
                   <input type="number" class="form-control">
                   </div>
                   </div>
                   <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

                   </form>
                   </div>

                  </div>





                  <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
                  <div class="row" id="meta-search">

                   <div class="col-sm-6">
                   <h5> IDs </h5>
                   <form action="" method="post">
                   <div class="row">
                   <div class="col mb-3">
                   <label>ID1</label>
                   <input type="number" class="form-control">
                   </div>

                   <div class="col mb-3">
                   <label>ID2</label>
                   <input type="number" class="form-control">
                   </div>

                   <div class="col mb-3">
                   <label>ID3</label>
                   <input type="number" class="form-control">
                   </div>
                   </div>
                   <button class="btn btn-primary btn-sm" name="submit1" type="submit">Search Record</button>

                   </form>
                   </div>

                  </div>






                  share|improve this answer












                  share|improve this answer



                  share|improve this answer










                  answered Nov 11 at 18:33









                  Nikhil Kinkar

                  363318




                  363318



























                      draft saved

                      draft discarded
















































                      Thanks for contributing an answer to Stack Overflow!


                      • Please be sure to answer the question. Provide details and share your research!

                      But avoid …


                      • Asking for help, clarification, or responding to other answers.

                      • Making statements based on opinion; back them up with references or personal experience.

                      To learn more, see our tips on writing great answers.





                      Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


                      Please pay close attention to the following guidance:


                      • Please be sure to answer the question. Provide details and share your research!

                      But avoid …


                      • Asking for help, clarification, or responding to other answers.

                      • Making statements based on opinion; back them up with references or personal experience.

                      To learn more, see our tips on writing great answers.




                      draft saved


                      draft discarded














                      StackExchange.ready(
                      function ()
                      StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53251699%2fhow-to-align-div-horizontally-in-a-row-using-bootstrap%23new-answer', 'question_page');

                      );

                      Post as a guest















                      Required, but never shown





















































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown

































                      Required, but never shown














                      Required, but never shown












                      Required, but never shown







                      Required, but never shown







                      -

                      這個網誌中的熱門文章

                      How to read a connectionString WITH PROVIDER in .NET Core?

                      圖片
                      6 I added .AddJsonFile("Connections.json", optional: true, reloadOnChange: true) in public Startup(IHostingEnvironment env) Connections.json contains: "ConnectionStrings": "DefaultConnection": "Server=(localdb)\mssqllocaldb;Database=DATABASE;Trusted_Connection=True;MultipleActiveResultSets=true", "COR-W81-101": "Data Source=DATASOURCE;Initial Catalog=P61_CAFM_Basic;User Id=USERID;Password=PASSWORD;Persist Security Info=False;MultipleActiveResultSets=False;Packet Size=4096;", "COR-W81-100": "Data Source=DATASOURCE;Initial Catalog=Post_PS;User Id=USERID;Password=PASSWORD;Persist Security Info=False;MultipleActiveResultSets=False;Packet Size=4096;", "MSEDGEWIN10": "Data Source=DATASOURCE; Initial Catalog=COR_Basic; Persist Security Info=False;Integrated Security=true;MultipleActiveResultSets=False;Packet Size=4096;Application Name="COR_Basic"", "server...
                      閱讀完整內容

                      Node.js Script on GitHub Pages or Amazon S3

                      圖片
                      0 I'm wondering if I can run a Node.js script in my Jekyll page from GitHub Pages or Amazon S3? I think it can't run on GitHub Pages since it doesn't support server side code. Not too sure. The code is below: var Airtable = require('airtable'); var base = new Airtable(apiKey: 'YOUR_API_KEY').base('appAnZVyYqusNPV5Q'); base('Invitee list').select( // Selecting the first 3 records in Complete list: maxRecords: 3, view: "Complete list" ).eachPage(function page(records, fetchNextPage) // This function (`page`) will get called for each page of records. records.forEach(function(record) console.log('Retrieved', record.get('Email')); ); // To fetch the next page of records, call `fetchNextPage`. // If there are more records, `page` will get called again. // If there are no more records, `done` will get called. fetchNextPage(); , function done(err) if (err) console.error(err); return; ); node.js ...
                      閱讀完整內容

                      Museum of Modern and Contemporary Art of Trento and Rovereto

                      圖片
                      Art museum in Rovereto TN, Italy Museum of Modern and Contemporary Art of Trento and Rovereto Museo d'arte moderna e contemporanea di Trento e Rovereto MART, Entrance Location Corso Angelo Bettini, 43, 38068 Rovereto TN, Italy Coordinates 45°53′38″N 11°02′42″E  /  45.8940°N 11.0450°E  / 45.8940; 11.0450 Coordinates: 45°53′38″N 11°02′42″E  /  45.8940°N 11.0450°E  / 45.8940; 11.0450 Type Art museum Director Gianfranco Maraniello Public transit access Trento train station. Taxis outside station. Website mart.trento.it The Museum of Modern and Contemporary Art of Trento and Rovereto (MART) ( Museo d'Arte Moderna e Contemporanea di Trento e Rovereto , in Italian) is a museum centre in the Italian province of Trento. The main site is in Rovereto, and contains mostly modern and contemporary artworks, including works from renowned Giorgio Morandi, Giorgio de...
                      閱讀完整內容