Topic on Project:Support desk

Use <div> tags instead of a table

I'm trying to create a template for semantic output results, which is limited to two columns, so the results go in column 1, column 2, then a new row starts and this repeats. As far as I can tell, CSS should be able to do this?

I have the following in my common.css:

.twocol::after td:nth-child(even) {

  content: "|-";

}

and i'm trying to insert this with <span class="twocol"></span>, with the hope that on every even column it inserts the table markup, but I'm having no luck... Is there something wrong with my code, or will this just not work?

What makes you expect that the added content would be interpreted as some markup instead of rendered as a plain pipeline character followed by a dash? The markup parsing and converting it to HTML on the server takes place before some CSS layout is rendered in your browser?

That makes sense. I'm starting to think my idea isn't possible without some kind of Lua module...

Don't use a table, but div instead.

You can make divs have display:inline-block, have a specific width, and they'll be placed one next to the other. If you put them on a fixed width div that only allow 2 divs on a row that will have the effect you want.

I'd never even considered that. Thank you so much