is it possible to make tables in smugmug ?

grosloulou

hallo,

i know tables are obsolete and not recommended for a whole site but i find it very convenient to have beautiful content without playing all the time with float:left, clear:both,...

is it possible in smugmug to create a table (table, td, tr) with for instance 5 rows and 2 columns with 5 150x100 or 100x100 images on first columns and centered text on right columns ?

i thought using such method to have a page "Links" in new smugmug with links to photographic sites with logo on left and description on right

no idea which width for the table so let's start with 400px width centered on a responsive smugmug page

in dreamweaver i could do that with a doctype header, a body, a div,... but in smugmug i have not clear ideas about what we can do with div, especially 100% display or 50% display...

if goal is not clear, i have found a joomla example with brands :

http://www.gwapamode.be/carnet-des-marques.html


thanks for help

best regards
marc

denisegoldberg

You can create tables in an HTML content block using valid html (including , ,

, and the corresponding end tags. Have you tried creating a table? --- Denise

grosloulou

denisegoldberg wrote: »

You can create tables in an HTML content block using valid <table> html (including <table>, <tr>, <td>, and the corresponding end tags.

Have you tried creating a table?

--- Denise

hallo denise,
not yet because i didn't know how to add css to html block and it seems "easy" in the css tab.
i thought i needed to create css sheets somewhere in smugmug trees to specify it applies to my about page only,...

for a table, would you first use a div ? for instance because it must be centered in a smugmug page which is supposed to be responsive...

kind regards
marc

miseryshusband

grosloulou wrote: »

hallo denise,
not yet because i didn't know how to add css to html block and it seems "easy" in the css tab.
i thought i needed to create css sheets somewhere in smugmug trees to specify it applies to my about page only,...

for a table, would you first use a div ? for instance because it must be centered in a smugmug page which is supposed to be responsive...

kind regards
marc

Nope, in the HTML block just start with <table> and end with </table>. Then click on the css and make your class and css. For example

table.center {
  width: 100%;
  vertical-align: top;
  border-collapse: collapse;
  text-align: center;
  padding: 0px;
  margin: 0px;
  border: 2px solid black;
}

table.center td {
  border-top: 1px solid black;
}

table.center th {
  border-bottom: 2px solid black;
  padding: 2px;
  border-top: 2px solid black;
  background-color: teal;
  font: bold 17px tahoma;
  text-align: center;
}

.tablefooter {
  border: 2px solid black;
  padding: 5px;
  background-color: #C8C8C8;
  font: bold 12px tahoma;
}

h2 {
  font: bold 18px Tahoma;
  padding: 0px 5px;
  color: black;
  margin: 15px 0px 0px 0px;
  text-align: center;}

This is the css code for my table at http://hickoryfootball.smugmug.com/

grosloulou

miseryshusband wrote: »

Nope, in the HTML block just start with <table> and end with </table>. Then click on the css and make your class and css. For example

table.center {
  width: 100%;
  vertical-align: top;
  border-collapse: collapse;
  text-align: center;
  padding: 0px;
  margin: 0px;
  border: 2px solid black;
}

table.center td {
  border-top: 1px solid black;
}

table.center th {
  border-bottom: 2px solid black;
  padding: 2px;
  border-top: 2px solid black;
  background-color: teal;
  font: bold 17px tahoma;
  text-align: center;
}

.tablefooter {
  border: 2px solid black;
  padding: 5px;
  background-color: #C8C8C8;
  font: bold 12px tahoma;
}

h2 {
  font: bold 18px Tahoma;
  padding: 0px 5px;
  color: black;
  margin: 15px 0px 0px 0px;
  text-align: center;}

This is the css code for my table at http://hickoryfootball.smugmug.com/

many thanks, miseryshusband

it is exactly what i was looking for
I have learned a lot with your code to make a beautiful table

I think smugmug should publish some examples like that even if the primary goal is to upload pictures.
I have some doubts all photographers are skill in html and smugmug editor tool is quite basic to do the same.

best regards

marc