CSS Help & Resources

[Impo]

Ok I think that's done it. What I've done is created a box and set it to relative using the position: code. I've also added on a bit of a margin to the right so that the text isn't poking out the side :3

3,600+


Mario Kart 7 Sig Collab

Paired to DragonOmega & Shining Raichu

.

Or failing that we could just get a mod/the original poster to add stuff in? xD

oh my god. You are amazing. Thank you so much :D !
I really appreciate it :D !

 

[Oryx]

You might want to move it left ~5-10 pixels though because right now it shows a horizontal scroll bar at least on my screen. It's not outside the rules but it ruins the effect a bit :(

 

[Impo]

I think I moved it a little :x

 

[Oryx]

Yeah, no more scrollbar for me. :3

 

[abnegation]

You do realise that does not work on IE Impo? It breaks the screen width.

 

[Oryx]

You could just make another div, like [cd="background-image:url('image.png');width:533px;height:270px;"][/cd]...that's what I would do at least.

 

[Mew~]

I had a similar problem a while back. I'd get rid of the opacity tag, and put in a transparent image as the background image. For example;

pair | youtube | lp | my forum | twitter | hack | blog | pho

Just quote this post and steal the code...
​

 

[donavannj]

I'd just have created another div with no background-color and no visible border that has the exact same dimensions as the transparent box, myself.

 

[Legendary Silke]

Or if you're willing to break compatibility with older browsers, try RGBA or HSLA colours at background-color. (instead of a hex value, rgba(a,b,c,d) and something similar for hsla - for rgba, a,b,c = in terms of 255, and d = in terms of 0.00 to 1.00) It's more of a convenience tool, though. For graceful degradation, put a duplicate background-color with the expected hex value or rgb value before the alpha-enabled one. On the other hand, PNG transparency is waaaaay easier and works with more browsers. It's probably a better idea to not fiddle with the CSS and replace the background-color with an image.

 

[donavannj]

Or if you're willing to break compatibility with older browsers, try RGBA or HSLA colours at background-color. (instead of a hex value, rgba(a,b,c,d) and something similar for hsla - for rgba, a,b,c = in terms of 255, and d = in terms of 0.00 to 1.00) It's more of a convenience tool, though. For graceful degradation, put a duplicate background-color with the expected hex value or rgb value before the alpha-enabled one. On the other hand, PNG transparency is waaaaay easier and works with more browsers. It's probably a better idea to not fiddle with the CSS and replace the background-color with an image.

PNG transparency isn't necessarily easier if you don't have graphical editing skills in the first place, or if the code is easier for you to work with than a program like Photoshop.

 

[Legendary Silke]

PNG transparency isn't necessarily easier if you don't have graphical editing skills in the first place, or if the code is easier for you to work with than a program like Photoshop.

I know, but this time, it's just a single color. Chances are, even if software is missing, a download of Paint.NET or GIMP, filling in the color values and painting the background image at once... (make another layer in GIMP first)

 

[Mew~]

I'm compiling a guide/database to Best Wishes for the Pokémon Anime Section, and I was just wondering what codes can I use to make a quick links in the top right hand corner like this thread;
http://www.pokecommunity.com/showthread.php?t=209543

 

[Hybrid Trainer]

That's actually a BB code mew :3
It's called an anchor. You need to use the a id code (here) and the aurl code (here)
It's kinda complicated at first but it's easy to pick up once you've done it a few times.

 

[Oryx]

Okay after struggling with this for a really long time I'm giving up. This sig is like one pixel too tall and idk where that 1 pixel is coming from or how to fix it. I tried all the tricks I found online to get rid of empty boxes in the case of relative positioning and in the end that helped some but now I can't....get rid...of the pixel...going to lose my mind. Please help. :(

Emi

Ibarazaki

Pokémon General ☼ Pokémon Voting Polls ☼ Pair ☼ Poetry ☼ VM ☼ PM​

 

[donavannj]

Um... use that invisible space unicode character.

 

[Oryx]

Uhh that makes it worse. :(

 

[donavannj]

Have you tried adjusting the markup to accommodate an outer div layer that wraps it all within with the dimensions of the whole signature?

 

[Oryx]

Ahh you did it! Thank you! :3

 

[Giraffe]

I'm using smaller CSS boxes on my trading thread, and I'm just wondering how you add a scroll onto them? :3

 

[Oryx]

You want the "overflow:auto;" tag in the css box that you'd like a scroll on. That will add one if the text spills over the height limit. :3