Home > Programming > HTML
Using the <columns> Tag
Give a div this style: <div style="column-width:200px; column-gap: 100px; column-rule: 5px double #ff00ff; column-count:3;">
column-rule values: "none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit"
I have not explored the column-rule attribute values much. In the first example below it is: column-rule: 5px double #ff00ff;. Each item of the list ends with <br>.
I've taken the liberty of using some real column-oriented data from another site to give an example. These are good people!
Massachusetts Council For the Social Studies
Past Presidents
Alberta Sebolt, 1970-71
Charles Mitsakos, 1971-72
George G. Watson, Jr., 1972-73
Patricia Glasheen, 1973-74
Carl Stasio, 1974-75
John Hadden, 1975-76
Donald (Sal) Salvucci, 1976-77
Barbara Capron, 1977-78
Anton Lahnston, 1978-79
Henry Hicks, 1979-80
William Spratt, 1980-81
Janna M. Bremer, 1981-82
Christian Castendyk, 1982-83
Sarah Madison, 1984-85
Joseph Lezon, 1985-86
June R. Coutu, 1986-87
Richard Aieta, 1987-88
Virginia Ahart, 1989-90
Debra J. Miller, 1990-91
Peter A. Santos, 1991-92
Karen E. Thompson, 1992-93
James J. Harrington, 1993-94
John Papadonis, 1994-95
Claire Austin, 1995-96
Carlyjane Dunn, 1996-97
Thomas MacDonough, 1997-98
Mary Ellen Sorensen, 1998-99
Susan Szachowicz, 1999-2000
Shaun Bresnahan, 2000-01
Richard J. Meegan, 2001-02
Valerie J. Degnan, 2002-03
Wendell C. Bourne, Jr., 2003-04
Kathleen Babini, 2004-05
Judith G. Heine, 2005-06
Dorothy J. Verheyen-Cudjoe, 2006-07
Roger Desrosiers, 2007-08
Sue Keane, 2008-2009
Jennifer Sears, 2009-10
Janice Fairchild, 2010-11
Bob Kostka, 2011-2012
Norman F. Shacochis, 2012-13
Bill Hocking, 2013-14
Gorman Lee, 2014-15
Steve Seto, 2015-16
Casey Cullen, 2016-17
Kerry Dunn, 2017-18
Norm Shacochis 2019-20
Note that if the list is an unordered list, column-rule does not work, and the first column starts too low compared with the others.
- Terrence O’Donnell, 1969-70
- Alberta Sebolt, 1970-71
- Charles Mitsakos, 1971-72
- George G. Watson, Jr., 1972-73
- Patricia Glasheen, 1973-74
- Carl Stasio, 1974-75
- John Hadden, 1975-76
- Donald (Sal) Salvucci, 1976-77
- Barbara Capron, 1977-78
- Anton Lahnston, 1978-79
- Henry Hicks, 1979-80
- William Spratt, 1980-81
- Janna M. Bremer, 1981-82
- Christian Castendyk, 1982-83
- Sarah Madison, 1984-85
- Joseph Lezon, 1985-86
- June R. Coutu, 1986-87
- Richard Aieta, 1987-88
- Virginia Ahart, 1989-90
- Debra J. Miller, 1990-91
- Peter A. Santos, 1991-92
- Karen E. Thompson, 1992-93
- James J. Harrington, 1993-94
- John Papadonis, 1994-95
- Claire Austin, 1995-96
- Carlyjane Dunn, 1996-97
- Thomas MacDonough, 1997-98
- Mary Ellen Sorensen, 1998-99
- Susan Szachowicz, 1999-2000
- Shaun Bresnahan, 2000-01
- Richard J. Meegan, 2001-02
- Valerie J. Degnan, 2002-03
- Wendell C. Bourne, Jr., 2003-04
- Kathleen Babini, 2004-05
- Judith G. Heine, 2005-06
- Dorothy J. Verheyen-Cudjoe, 2006-07
- Roger Desrosiers, 2007-2008
- Sue Keane, 2008-2009
- Jennifer Sears, 2009-2010
- Janice Fairchild, 2010-2011
- Bob Kostka, 2011-2012
- Norman F. Shacochis, 2012-2013
- Bill Hocking, 2013-2014
- Gorman Lee, 2014-2015
- Steve Seto, 2015-2016
- Casey Cullen, 2016-2017
- Kerry Dunn, 2017-2018
- Norm Shacochis 2019-2020
References
Automated div columns: https://www.w3schools.com/cssref/css3_pr_columns.asp.