Skip to main content
Main Content

Changing table colors, adding a background image, HALP

Changing table colors, adding a background image, HALP
Posted 2020-09-25 13:40:30

Hi! So I am used to lioden and use one table for basically everything there that I just adjust to my needs, and coming here it doesn't work here lol. So I'm building one from scratch, but I don't understand where to stick my styling codes. If needed I can post the base code I have now from using the thread buttons, but really all I need is what part to stick them like in <tr*> <td*> etc


Scouting for Booty
#1810

Posted 2020-09-25 13:43:08

Figured out part of it, how do I put in a background image instead of color


Scouting for Booty
#1810

Posted 2020-09-25 13:44:29

Figured it out oml I was siking myself out


Scouting for Booty
#1810

Posted 2020-09-25 14:36:07

how... i haven’t been on lioden since i was like 19! please explain


Pikachu
#409

Posted 2020-09-25 14:54:15
I will as soon as I hear back from bugbox! Apparently I'm using a css code, though I can use it in the lioden forums so I'm not sure how it mistranslates. Basically I just added <td style=""*> before <tbody*> but it messes up when I go to edit after submitting

Scouting for Booty
#1810

Posted 2020-09-28 10:12:15

Bugbox has not answered, if anyone could help that'd be amazing! I've seen its been done already here


Scouting for Booty
#1810

Posted 2020-09-28 14:23:54
I'm not sure what the question is? The forums use html, so you can't use div tags; you have to use your style tags in elements like the table, p, or span. This is a super basic code for a basic table:

<table style="width: 100%; border: 1px solid #000000; color: #000000; background-color: #9dc6d4;"><tbody><tr><td>Hello, I am a table.</td></tr></tbody></table>

Hello, I am a table.

And for a background image, you would change the background-color: #9dc6d4; code to background-image: url('DIRECT-IMAGE-LINK');. For example, if I used this image, this is how the code would look:

Hello, I am a table.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dignissim fringilla ornare. Donec mattis erat ac sapien pulvinar, at euismod tortor pellentesque. Ut lacinia malesuada diam quis rutrum. Duis tincidunt pulvinar lectus eget imperdiet. Sed sed lectus velit. Donec dictum at enim ut aliquam. Fusce non enim et nisi facilisis placerat vel feugiat felis.

Nunc eu leo nibh. Vestibulum fringilla, nunc eget tincidunt accumsan, turpis lectus egestas erat, in vulputate velit nisl sed enim. Morbi malesuada ligula sem, eget facilisis odio ullamcorper in. Curabitur purus velit, luctus ultrices consequat eget, vulputate in massa. Curabitur ultricies diam ut arcu facilisis, viverra posuere leo semper. Curabitur ultricies dolor non est aliquam, in porttitor massa rhoncus. Nulla facilisi. Morbi ac leo felis. Nunc egestas mi convallis sapien convallis, id vehicula enim tincidunt. Aliquam tempor scelerisque lectus, ac scelerisque magna efficitur non. Cras ac leo a orci tristique cursus. Sed sollicitudin justo massa, eget tempor urna luctus vitae. Cras eu pellentesque ligula, nec imperdiet magna. Maecenas faucibus ac diam posuere luctus. Phasellus varius enim tincidunt cursus ullamcorper.

Suspendisse non nisl quam. Etiam elementum risus libero, eu faucibus orci bibendum sed. Morbi at turpis velit. Phasellus eu ipsum tellus. Morbi eget interdum enim, sed elementum lorem. Suspendisse porttitor leo non erat vulputate suscipit. Vivamus sed mollis dui. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Etiam ut aliquet nibh. Donec volutpat, risus at tristique dictum, tellus arcu condimentum lorem, sed suscipit dolor risus eu nulla. Maecenas vulputate nisl ac purus ornare, quis imperdiet justo hendrerit. Pellentesque eleifend sem dolor, egestas commodo nibh commodo eget. Cras vitae augue et neque iaculis rhoncus.

Nulla sed est ipsum. Duis aliquam nibh a facilisis ullamcorper. Fusce dui magna, tincidunt et sem ac, cursus euismod felis. Suspendisse cursus ex ut blandit commodo. Suspendisse id porta tellus, et imperdiet dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque ut odio sapien. Suspendisse vestibulum urna at sollicitudin placerat.

Depending on where you put your styling, different parts of the table will be affected. For example, in this case, I put the background image in the table tag, so it will affect the entire table, but you could put it in the td tag to affect only that table data. Just for example:

I am the left part of a table. I have background-color: #9dc6d4; as my background.I am the right part of a table. I have background-image: url('DIRECT-IMAGE-LINK'); as my background.

Hope that addressed the confusion. :)

fireflii
#757

Posted 2020-09-28 14:35:13
Those are the codes I used but apparently they don't work here because when I got to edit my post, it messes up the ENTIRE code, not just the background image code. I don't use divs, I use those you just put in. This is incredibly frustrating

Scouting for Booty
#1810

Posted 2020-09-28 14:41:05
Oh yeah, there are issues with the posting mechanic. For example, if you're on preview mode, and you click the center paragraph align, it doesn't work. You have to go to code view to center it. Best work around is to copy your entire post before you post it, paste it into something like Notepad or TextEdit, and save it there. That way whenever you go back to edit, you can copy that from where you left off.

fireflii
#757

Posted 2020-09-28 14:41:18
I'm familiar with coding, I did it over on Lioden and that is literally what I've used but when I go to edit my post, it shows up as: <table style="background-image:url(" https:="" opengameart.org="" sites="" default="" files="" seamless%20space_0.png");width:530px;border:3px="" solid="" #dcc6ff;text-align:center;color:#dcc6ff;"="">

Scouting for Booty
#1810

Search Topic