[ARCHIVED] Use Divs Instead of Tables on Home Page

[franke]

Hi all.  Wondering if anyone can help me adjust a Canvas page using tables with image buttons to a page using div tags in two or three columns.  I've referenced this Home Sweet Homepages without Tables article (thank you  @clong  but I'm still not able to set it up correctly.   I've attached the HTML in the attached word document.  Thanks in advance for any help! 

**Also to note we have limited access to the code so cannot do any CSS as we don't have admin access as ID's!

[d00386959]

I recommend looking into the grid that is built into Canvas.  You use .grid-row and col-xs-## classes to build a grid with columns.  It can even be responsive.  Check it out here.

[franke]

Thanks for the tip!  I think our instance of Canvas must strip that element of the Style Guide (does this with accordions too) so this is what it looks like once I insert the code:

[tina_busch]

Hi Emily

Have a go at copying and pasting the code on the attached word doc .

This is using the div class Content Box. I use this class a lot for homepage design. All "buttons" are editable and responsive so if viewing on small screen or mobile they stack under each other. You'll need to add your links or you can insert your images and make the background colour of each grid "cell" white and add the links to the images.

I hope it's helpful. If you need help deciphering the html let me know and I'll do a screencast.

Cheers

Tina

[franke]

Thank you Tina!  This did the trick and worked for me   I appreciate your sharing.