So, what I'm trying to do ought to be easy. Very easy. Sadly, I've been repealy banging my head against a very solid wall trying to get it to work by any method that isn't horribly crude. What I'm trying to do is create a simple image-and-text gallery listing the major categories for my wiki, as a entry point for people visiting for the first time without something specific to search for. Put another way, I just want to create a graphical category list that will allow a new user to see and choose from the main categories the site is divided into. I currently have a horribly-horribly-HORRIBLY crude version on the main page:
The problem is that this is a hacked, horrible, temporary solution that resulted from me getting frustrated with trying to find a way to do what I wanted (Playing with the Listpages module for example, which seemed like the most likely module to be helpful). The brute force method I used in order to get the text to align properly with the images only works properly on desktop(or large screen mobile devices in landscape mode), as I eventually gave up on reasonable attempts and just forced white space into the text to align it properly (hence my repeated use of the word horrible in relation to what I did). The moment someone tries to access this via a mobile device, particularly in portrait alignment, the entire thing will scramble into gibberish. What I'm trying to do is create this in a way that it auto-adjusts like it should, keeping text and images together regardless of how it has to move things for different screen resolutions/sizes/etc. It's probably I'm missing something obvious, like a way to use a simple table to fix this, but half the problem stems from most of my solutions only working with proper CCS or HTML tags, and wikidot doesn't seem to accept them properly, attempts to enter code as I know how to use it for webpages….just results in the code appearing as text.
Anyone got a solution for idiot me?