Choir Mission Statement

"Providing quality choral experiences and educational opportunities to the community since 1968"

Concerts Main Page

 

Concerts Main Page

 

 

Images Side by Side

How to create side-by-side images with CSS Flexbox:

singalong
singalong
singalong

 

Images Side by Side

How to create side-by-side images with CSS Flexbox:

Snow
Forest
Mountains

 

 https://www.w3schools.com/howto/howto_css_images_side_by_side.asp

Had to add

.row {
  display: flex;
}

.column {
  flex: 33.33%;
  padding: 5px;
}

to the custom css - this is a flexbox thing

 

 hereeeeeeeee

  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5

 

https://www.itsupportguides.com/knowledge-base/website-tips/how-to-make-two-column-list-items-using-basic-css/

add a new code in template for "threecolumns" ?? put image in 3 columns??

 

++++++

 

ul.twocolumns {
    display: inline-block;
}

ul.twocolumns li {
    float: left;
    list-style: outside none none;
    width: 50%;
}

and your HTML will look like this

<ul class="twocolumns">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
</ul>

How do I add more columns?

The examples above used 50% to create to columns – simple change the percent to change the number of columns.

  • 2 columns = 50%
  • 3 columns = 33%
  • 4 columns = 25%
  • 5 colunns = 20%
  • 6 columns = 16%

+++++++++++++++++++++

ul.threecolumns { display: inline-block; } ul.threecolumns li { float: left; list-style: outside none none; width: 33%; }

  • Item 1 helloooooooooooooo
  • Item 2 helloooooooooooooooo
  • Item 3 hhhelloooooooooooo
  • Item 4
  • Item 5

++++++++++++++++++

 

  • Item 1 helloooooooooooo
  • oooooooooooopppppppp
  • Item 2 hellooooooooooooooo
  • oooooooooooooppppp
  • Item 3 hhhelloooooooooo
  • ooooooooooooooppppppppp
  • ++++++++++++++++++++++++++++
    • Item 1 singalong
    • Item 2 singalong
    • Item 3 singalong

     singalong

     

    Spring 2023
    O Love - Elaine Hagenberg

    Praise to the Lord
    Heritage String Quartet

    Spring 2023 - You Know Better Than I
    from Joseph King of Dreams - Ray'mond Fields