Faux Tables for Dreamwidth - Character & CR Chart Edition!

[veryroundbird]

One of the complaints I'm hearing about DW is that tables don't work properly, which are obvs. important to us RPers for things like character lists, CR charts, and taken/reserved/whatever lists.

I've been working on some workarounds for such things, being a helpful HTML monkey. Here's my version of a character list/CR table code: here @ pastebin (because DW keeps borking my textarea every time I try to edit and apparently dislikes iframes)

Linebreaks and tabs added for readability; you'll probably want to strip those before using the beta update page if you do, because I believe it turns those into visible linebreaks, which'll give you more spacing than you probably intended. The regular editor will just strip out all of that when you go to rich text mode and leave you with the plain HTML sans whitespace.

It'll end up looking like this:

heading here.

This is a basic example of how you would make a two-column character info widget thing, with a picture, name, and info.

♥ ♥ ♥ ♥

but what if I want CR chart symbols?

Funny you should ask that! In that case, take the "float" property off of the image, and wrap it with a div tag with the style property 'float: left' or 'float: right'. You can add a line break after the image, and then put your CR symbols underneath, also inside the div wrapper.

If your text is long, you may want to add 'width: 100px' to the div tag, too.

can I right-align this?

WHY YES YOU CAN.

how do I shot customizing?

Oh gosh, there are so many ways you can do so! If you are not familiar with CSS, I direct you to the W3Schools CSS Tutorial, which will help you in that regard.

Tah-dah!

Comments

[demimonde]

'Funny you should ask that! In that case, take the "float" property off of the image, and wrap it with a div tag. You can add a line break after the image, and then put your CR symbols underneath, also inside the div wrapper.'

how do i shot wrapping please ;_;

(I want to put game | wiki links underneath the image)

[veryroundbird]

AHA yes thank you for asking, I am bad at the splainings sometimes

Anyway, so the div tag that goes around the image and the text underneath; you'll want to add the property width: 100px to the style bit to make the text wrap underneath, I forgot to put that in. Is that what you're asking about?

[demimonde]

I...think it might be??? CAN I JUST LINK YOU TO WHAT I'VE GOT SO FAR AND ASK WHAT I NEED TO DO TO MAKE IT DO A THING :V

[demimonde]

NEVERMIND I DID SOMETHING ELSE INSTEAD

[tuberose]

Oooh, Carly you are lovely.

I will play with this later when I am less of a derp, and/or you are online so I can pester you more directly for help with things. >__>

(At least I'm honest?)

[trenchcoatedly]

i just used this for castiel's CR here and i just want tell you how great it looks. thanks!!