CSS Help & Resources

  • Thread starter Deleted member 143209
  • Start date
Toujours said:
Can you explain what's annoying? It looks perfectly alright for me (the sprite is animated as well):

[PokeCommunity.com] CSS Help & Resources
Click to expand...

Yeah, but I want the "pokewalker" in the box xD And I can't get it on the place I want.

jigglyppuff8 said:
If it's the text being under the box that's the problem, then use
Click to expand...
 
For some reason the links in my signature don't work. I have a link on IRC, one on Talk, and one on Me, and none of them are activating.

PHP: 
[cd="height:120px;width:500px;overflow:visible;"][cd="background-image:url("https://i53.tinypic.com/2m28kn9.png");  width: 500px; height: 200px; float:left;"]
[cd="font-size: 20px; color:#330000; text-align:  left;decoration:none;font-family:"Trebuchet MS";position:relative;  top:-15px; left:160px; overflow:auto; width:500px;  height:280px;letter-spacing:10px;line-height:40px;text-shadow:0px 0px  5px #ffffff;"]★[title="Catch all non-Unova Pokemon in  Unova"]Goal[/title]
[cd="font-size: 15px; color:#737373; text-align:  left;decoration:none;font-family:"Trebuchet MS";position:relative;  top:-15px; left:60px; overflow:visible; width:200px;  height:200px;letter-spacing:7px;line-height:40px;text-shadow:0px 0px 5px  #ffffff;"][title="133/174, 76.4%"](Progress)[/title]
[cd="font-size: 20px; color:#330000; text-align:  left;decoration:none;font-family:"Trebuchet MS";position:relative;  top:-5px; left:-59px;  overflow:visible;height:100px;letter-spacing:10px;line-height:40px;text-shadow:0px  0px 5px #ffffff;"]★[title="Sanguinius <3"]Pair[/title]
[cd="font-size: 20px; color:#330000; text-align:  left;decoration:none;font-family:"Trebuchet MS";position:relative;  top:16px; left:0px;  overflow:visible;height:100px;letter-spacing:10px;line-height:40px;text-shadow:0px  0px 5px #ffffff;"]★IRC
[cd="font-size: 15px; color:#737373; text-align:  left;decoration:none;font-family:"Trebuchet MS";position:relative;  top:-15px; left:60px; overflow:visible; width:200px;  height:30px;letter-spacing:7px;line-height:40px;text-shadow:0px 0px 5px  #ffffff;"](Talk to me)
[/cd][/cd][/cd][/cd][/cd][/cd][/cd]
[cd="font-size: 15px; color:#330000; text-align:  left;decoration:none;font-family:"Trebuchet MS";position:relative;  top:-10px; left:217px;  overflow:visible;height:50px;width:500px;letter-spacing:5px;line-height:40px;text-shadow:0px  0px 5px #ffffff;"]I ask for nothing, I can get by
[/cd]
[cd="font-size: 15px; color:#330000; text-align:  left;decoration:none;font-family:"Trebuchet MS";position:relative;  top:10px; left:300px;  overflow:visible;height:50px;width:500px;letter-spacing:5px;line-height:40px;text-shadow:0px  0px 5px #ffffff;"]but I know so many less lucky than I[/cd]
 
They're there, I just forgot to switch out of the dumb rich text mode before I copied it so it copied as if they're not there. the links look like this:

PHP: 
[url="blahblahblah.com"][color=#123456]IRC[/color][/url]

I tried putting the url inside so the link color showed up but I still couldn't click it.
 
Please forgive me for starting completely over, but I could not follow your code with all of its positioning and height and width shenanigans.

★Goal
(Progress)
★Pair

★IRC
(Talk to me)
I ask for nothing, I can get by
but I know so many less lucky than I​

Spoiler:


I wouldn't use so many divs for just simple text. Divs tend to add line breaks whenever a new one is added which is quite pain if your code doesn't require divs. Spans work just as well at getting the job done without having to add a line break or height/width shenanigans.

Now, indepth break down of what I did. Hopefully it won't be too hard to follow.

1. Start with
to make it center align.
2. Declare a [cd] div that will contain the background-image. It will hide anything that spills out of it.
3. Use
to left align anything with this div.
4. Declare another [cd] div that will contain the code used most often so that it doesn't have to be repeated in each new span/div. For example, the margin-left:160px; moves all the text over at least 160px from the left edge.
5. Use [span]s around the text and code that they need individually.
6. Close each [span] after the text they modify. Compare to how you had all of your [/cd]s at the end.
7. Close the second [cd] div.
8. Close the
.
9. Close the first [cd] div.
10. Make a new [cd] div that will contain the rest of the text.
11.
to left align everything again.
12. [span] on the first line to move it over like you had and closed on the first line.
13. Close the
.
14. Close this [cd] div.
15. Close the
.

Links should work. I don't know what they are, so you should put them in yourself.​
 
I'm not sure I quite understand, but I'll take your word for it because it works. xD Thanks!
 
How can i make Dark to Lime green text colors?
Like in jigglypuff's?
 

PHP: 
[RIGHT][title="The best Pokémon ever"][div=" width: 450px; height: 210px; background-image:URL('https://img541.imageshack.us/img541/8013/shinyswellowdwz.png'); padding-left: 19px; padding-right: 19px; "][RIGHT][COLOR="#178262"][SIZE="5"][FONT="Slackey"][title="hunting, 765 eggs"]SHINY SWELLOW[/title][/FONT][/COLOR][/SIZE][/RIGHT]

[div=" width:10px;"][sound="swellow"]https://veekun.com/dex/media/cries/277.ogg[/sound][/div]
[title="Click all links please"]
[div=" width:110px; height:70px; overflow:auto; border-radius: 50px; border-style: solid; background-color: #FFAB40; border-color: #EE6A02"]
[CENTER][URL="https://www.youtube.com/user/pokedragonmaster"][title="Sub me please"][COLOR="#FFFFFF"][B]My YouTube[/title][/B][/COLOR]
[URL="https://www.pokecommunity.com/members/119663"][B][COLOR="#FFFFFF"][title="Awesome guy, check him out!"]My CSS Teacher[/title][/URL]
[/B][/COLOR][/URL][/CENTER][/div][/title]
[/div][/title][/RIGHT]

Basically I want the black/grey thing in the back away, and I want the music bar to be resized which I saw in Roswell's sig and then it'll fit in Swellow's mouth. Anyone have any suggestions?
 
Hey can anyone help me out? I'm looking for a way to make a text box on my thread, but i don't know how T_T. Is it just standard CSS commands? Or do i have to make an image and insert it?
 
Hybrid Trainer said:
Well by text box do you mean the scroll one? because to do that all you need to do is create a CSS box and set it to overflow, like this

text
text
text
text
moar text


the code looks like this
[div=" width:100px; height:50px; overflow:auto;"]
text
text
text
text
moar text
[/div]
Click to expand...

Ah sorry I meant infobox.
 
Phew thanks you're a lifesaver :D

And how do I make the subsections inside the big box?
 
Last edited:
Just wondering, how do you do the 'hover text' with CSS? I've tried following this, yet I still can't do it. Any help please?
 
You must log in or register to reply here.
Back
Top