Coding Discussion/Help Thread

[L△LIA]

I thought it'd be super helpful if we had a thread where we could all help each teach each other coding and figure out how to do things! ^^ I've had some people asking me to help teach them how to code tables lately and I'm totally more than happy to share what I know, so I thought this would be the easiest way and everyone can help each other! Also, I feel like there are a lot of people who know way way wayyyy more than I do and would be infinitely more helpful, lol. Also, also there are things I wish I knew how to do that I'm hoping people could help ME figure out, lollll.

So I suppose I'll start off with my own question. XD

Okay, so what I've been trying to figure out lately is how to set an image as the background for a table so that you can sort of "float" a slightly smaller square of color on top of it. Like if you had a border around an image, but reversed? So that the image is the border and the center part is a plain color. Does that make the least bit of sense? XD (After that I want to make the block of color semi-transparent, which I -do- know how to do.) Here's my failed attempt: LINK. I'm aware of some of the things that are wrong because I got frustrated and just started changing ALL THE THINGS lol. I feel like this has a really simple solution and that I'm whatever I'm doing wrong is something... not that hard, lol, but sometimes I get my different coding styles mixed up and I have the hardest time sorting things out, fttttt.

Help, help? D: <3

Also people should feel free to chime in with their own questions for help!

[Onyx]

Hey guys! Just here adding my two cents

My answer to your question, Lalia, is that you have to look at this style property here. The border image property, it seems to me, is the shorthand form of all five more complex border properties:

• The image source (click) which is essentially just the URL of the image inserted in the same way that the URL of a background would be
  
• The image ‘slice’ (click) which defines how much of the middle of the image is cut off (that is, the inwards inset, as written on that site) or if none is cut off at all
  
• The image width (click) which is pretty straightforward, just how thick the border is
  
• The image outset (click) …I don’t really understand this one but I guess experimenting is the way forwards?
  
• The image repeat (click) so, if the image is too small, whether it should tile without being resized, stretch to fit perfectly or tile and resize.

NB: This coding isn’t guaranteed to work because I haven’t tried it and I honestly have no idea what I’m talking about ever, really.

There are some problems with this coding, in that, and you’ll see this by looking at the individual options for each piece of code, the options aren’t supported on their own. As well as this, a different coding extension has to be used if you use Firefox, Chrome, Safari or Opera (but let’s be honest, who uses Opera?) and so the coding might appear differently on different people’s browsers, or not work at all.

Therefore, I say be careful with it, but go ahead and experiment, for sure! I’ve come to love tables, and this website is my saviour, so once you understand how tables work syntax-wise, this website is super duper helpful!

I’ll be back with questions soon :3

[/color][/blockquote][/justify]