Hey there! Sign in to join this conversationNew here? Join for free
x Turn on thread page Beta
    • Welcome Squad
    • Thread Starter

    Welcome Squad
    Hey guys, I'm looking for some help on how to group rows within a table together, so that the heading down the left hand side then has three smaller headings just to the right of it, as in the photo attached. Basically, I'd like to add a mini column of headers to represent more detailed data within a table, as seen in the 'Media Sharing' and subsequent rows part of the table.

    I'm new to HTML/CSS and know my way around basic page layouts, tabling and some CSS, but I can't find anywhere that tells how to do this! Any help would be much appreciated...

    Name:  20151030123309.jpg
Views: 93
Size:  245.6 KB

    You need to use the "colspan" and "rowspan" attributes. In this case:
    <td rowspan="3">Media Sharing</td>
    will span the cell over those three rows. The caveat here is that you then need to make sure that all the other cells in that column - Networking, Communication etc - have a colspan attribute:
    <td colspan="2">Networking</td>
    so that they span across both the Media Sharing cell and the sub-cells, otherwise you'll end up with a very confused layout.
Submit reply
Turn on thread page Beta
TSR Support Team

We have a brilliant team of more than 60 Support Team members looking after discussions on The Student Room, helping to make it a fun, safe and useful place to hang out.

This forum is supported by:
Updated: November 30, 2015
Do you agree with the proposed ban on plastic straws and cotton buds?
Useful resources

The Student Room, Get Revising and Marked by Teachers are trading names of The Student Room Group Ltd.

Register Number: 04666380 (England and Wales), VAT No. 806 8067 22 Registered Office: International House, Queens Road, Brighton, BN1 3XE

Write a reply...
Reputation gems: You get these gems as you gain rep from other members for making good contributions and giving helpful advice.