However, it turned out like this:
It almost seems like images are fixed-width. It stubbornly refuses to resize. Which is fine, because I could just move the images out on its own container and be right/left-aligned to its own sides, so i could fit it in and stop the green from filling out all the empty spaces it could find. That's when i ran into problem: I couldn't create another container to hold everything without it conflicting with things inside. Left, Right, Center, they were all used. So i just decided to do a quick fix, using [i] as the parent container to everything but the green box. This is what i expected to occour.
Unexpectedly, though, this happened.
Which is fine for my sig, as i planned to change the image containers anyways, but it confused me. I've developed websites and done CSS for a few years, but ive never coded with BBCode until recently, which is why i am extremely unfamiliar with it, but based on the knowledge i have from designing websites and stuff, how is the green box, which is a sibling of the purple [i] box, end up inside the [i] box? Almost like the green box has absolute position. This could of course just be because the [i] box isnt meant to be a literal container, but rather a style- and thus does not have container properties. But then, what can i use that has container properties? Normally in web development i can freely use things like <div> nested, as they can stack within each other, but here I can't stack the left/right/center, and there is no <div>. I'm not quite sure what to use for the container outside.
So to summerise:
If BBCode’s left/right/center containers can’t be stacked, and [i] isn’t a true container, what can be used as a parent container without interfering with child contents?
If anyone could help, i would really appreciate it!
