Go Back   The PokéCommunity Forums > Off-Topic Discussions > The Lab
Reload this Page CSS Help & Resources

Notices
For all updates, view the main page.

The Lab From the computer lab to the chemistry lab, or even the observatory, here's where we nerd out over all things science and technology!



Reply
 
Thread Tools
  #376    
Old May 15th, 2011 (5:56 AM).
Neptune Vasilias's Avatar
Neptune Vasilias Neptune Vasilias is offline
 
Join Date: Dec 2010
Location: Not here, at least.
Age: 19
Nature: Adamant
Posts: 1,146

Quote originally posted by Impo:
Actually, that's a common problem. I have had it too.
I think the computer reads the beginning of the code, but gets confused and believes you forgot the ending, and tries to create one for you.

To remedy this try writing the code with the editor mode switched (top right button, the underlined A and the normal A.

Quote originally posted by Abnegation:
It happens when you use BB code on your CSS so if you have this for example

[css-div="color: black

It's going to mess up because your codes are mixed up in BB code. Refer to the post above mine for what to do.

Thanks to both of you. I switched to editor mode and cleaned up the messy codes and now it's A-Ok. :D

XOXO~

Reply With Quote

Relevant Advertising!

  #377    
Old May 15th, 2011 (10:25 PM).
Neptune Vasilias's Avatar
Neptune Vasilias Neptune Vasilias is offline
 
Join Date: Dec 2010
Location: Not here, at least.
Age: 19
Nature: Adamant
Posts: 1,146

Another question, does anyone know how to make text boxes in signatures rounded at the corners? The one I'm constructing now looks ugly with the sharp corners of the rectangle.

Reply With Quote
  #378    
Old May 15th, 2011 (10:57 PM).
zappyspiker's Avatar
zappyspiker zappyspiker is offline
c h a t ★ n o i r
Gold TierEO
 
Join Date: Jul 2008
Location: Wellington, New Zealand
Age: 21
Gender: Female
Nature: Quiet
Posts: 4,603

I remember answering a question like that a while ago

Quote originally posted by zappyspiker:
You add just change the roundness of a rectangle box:

-moz-border-radius: 12px; -webkit-border-radius: 12px;

Just change how many px to how rounded you wanted to be

__________________
Reply With Quote
  #379    
Old May 15th, 2011 (11:01 PM).
Neptune Vasilias's Avatar
Neptune Vasilias Neptune Vasilias is offline
 
Join Date: Dec 2010
Location: Not here, at least.
Age: 19
Nature: Adamant
Posts: 1,146

Quote originally posted by zappyspiker:
I remember answering a question like that a while ago

So do I add together with the box code or place it separately?

Reply With Quote
  #380    
Old May 16th, 2011 (5:04 AM).
donavannj's Avatar
donavannj donavannj is offline

Nico Nico Nii!~

ModeratorCSEO
 
Join Date: Mar 2005
Location: Otonokizaka
Age: 25
Gender: Male
Posts: 18,755

Quote originally posted by Diamond1304:
So do I add together with the box code or place it separately?

Well, considering it won't apply to that box if it's not placed next to the code, what do you think? ;)

__________________

Original vector used for avatar credit to /u/judealonzo01 on Reddit via /r/SchoolIdolFestival
GIF credits to an unknown individual for original; machomuu for resizing
Avatar Featuring Nico Yazawa from Love Live! School Idol Festival
Signature Featuring Nico Yazawa and Maki Nishikino from the same series
Reply With Quote
  #381    
Old May 17th, 2011 (4:41 PM).
Ooka's Avatar
Ooka Ooka is offline
<3
Crystal Tier
 
Join Date: Aug 2007
Location: Challenging The E4
Age: 23
Gender: Male
Nature: Relaxed
Posts: 2,612
Send a message via Skype™ to Ooka

Just a couple things. To correctly center things with CSS, you should use margin-left: auto; margin-right: auto;. Also, you no longer need -moz-, -webkit-, or -khtml-. border-radius: is now recognized by all the main browsers (Unless you're aiming for backwards compatibility).

You can also use clear: both; to clear your floats, if necessary.

Reply With Quote
  #382    
Old May 24th, 2011 (4:02 PM).
Owl's Avatar
Owl Owl is offline
Crystal Tier
 
Join Date: Jul 2009
Age: 21
Gender: Female
Posts: 13,367

Is there a code so that I can get text on the side of my image?

Ex.:


I want to get the text on this side, without moving the image all the way to the left and without it always being on the bottom.

So is it possible?

__________________


Reply With Quote
  #383    
Old May 24th, 2011 (5:40 PM).
donavannj's Avatar
donavannj donavannj is offline

Nico Nico Nii!~

ModeratorCSEO
 
Join Date: Mar 2005
Location: Otonokizaka
Age: 25
Gender: Male
Posts: 18,755

[image="left"][/image] is the only way I can think of that would do that. Otherwise you'd have to place your picture in its own div and monkey around with that div's positioning.

__________________

Original vector used for avatar credit to /u/judealonzo01 on Reddit via /r/SchoolIdolFestival
GIF credits to an unknown individual for original; machomuu for resizing
Avatar Featuring Nico Yazawa from Love Live! School Idol Festival
Signature Featuring Nico Yazawa and Maki Nishikino from the same series
Reply With Quote
  #384    
Old May 24th, 2011 (5:57 PM). Edited May 24th, 2011 by jigglyppuff8.
jigglyppuff8's Avatar
jigglyppuff8 jigglyppuff8 is offline
 
Join Date: Jun 2007
Location: PA, USA :effort
Age: 22
Gender: Male
Nature: Modest
Posts: 2,326

[image="left"][/image] "moves it all the way to the left" so to speak. Or at least more left than the default. Compare


I want to get the text on this side, without moving the image all the way to the left and without it always being on the bottom.

to


I want to get the text on this side, without moving the image all the way to the left and without it always being on the bottom.
Aside from monkeying around with the padding and positioning like don suggested, I'm at a loss.

EDIT: Also, I'm playing around with my Tumblr and I can't seem to find anyway to change the background of my latest tweets. Anybody here know what I div and class I'd have to change?

__________________
迷いながらトキメイタ 
記憶は儚くて消えないで

Reply With Quote
  #385    
Old May 26th, 2011 (9:38 PM).
Alternative's Avatar
Alternative Alternative is offline
For my next trick...
Crystal Tier
 
Join Date: Jan 2009
Location: Adelaide, Australia
Age: 23
Gender: Male
Nature: Impish
Posts: 4,254

I need help. I made a thread with coding here, and apparently something's wrong with it, something to do with it outside the box. My conclusion is that I've used position: absolute for it, so how would I go about fixing it?

__________________
Reply With Quote
  #386    
Old June 3rd, 2011 (7:27 PM).
Owl's Avatar
Owl Owl is offline
Crystal Tier
 
Join Date: Jul 2009
Age: 21
Gender: Female
Posts: 13,367

Another quick question, I've seen some people with CSS that makes the images/text unmovable or copyable, and I was wondering what's the code for that? I've tried searching for it, but I haven't found it.

__________________


Reply With Quote
  #387    
Old June 3rd, 2011 (7:34 PM).
donavannj's Avatar
donavannj donavannj is offline

Nico Nico Nii!~

ModeratorCSEO
 
Join Date: Mar 2005
Location: Otonokizaka
Age: 25
Gender: Male
Posts: 18,755

Quote originally posted by Charizard★:
Another quick question, I've seen some people with CSS that makes the images/text unmovable or copyable, and I was wondering what's the code for that? I've tried searching for it, but I haven't found it.

Give an example of this, please. I have no idea what you're talking about.

__________________

Original vector used for avatar credit to /u/judealonzo01 on Reddit via /r/SchoolIdolFestival
GIF credits to an unknown individual for original; machomuu for resizing
Avatar Featuring Nico Yazawa from Love Live! School Idol Festival
Signature Featuring Nico Yazawa and Maki Nishikino from the same series
Reply With Quote
  #388    
Old June 3rd, 2011 (7:34 PM).
jigglyppuff8's Avatar
jigglyppuff8 jigglyppuff8 is offline
 
Join Date: Jun 2007
Location: PA, USA :effort
Age: 22
Gender: Male
Nature: Modest
Posts: 2,326

That's just because the image was used as a background image.

Regular img tags:

background-image property:

__________________
迷いながらトキメイタ 
記憶は儚くて消えないで

Reply With Quote
  #389    
Old June 3rd, 2011 (7:52 PM).
Xyrin's Avatar
Xyrin Xyrin is offline
Furret
Gold Tier
 
Join Date: May 2008
Location: Northern Indiana, USA
Age: 17
Gender: Male
Nature: Jolly
Posts: 1,065

I want to learn how to curve the box in this thread right here. I know the code to do it but whenever I try it, it doesn't work. If somebody could give me an example or even show me what I would need to do in my own code that'd be great. Here's my code.

HTML Code:
[FONT="Segoe UI"][COLOR="Black"][CENTER][css-div="padding: 2px 2px 2px 2px; border: dashed 1px red; color: #black; background-color: red;"]
Blarg blarg blarg. This is the stuff in my box. blargy

[/css-div][/CENTER][/COLOR]

[/FONT]

__________________

Furret


The Creeper Hub ~ x - Icons by Anastasia - My Twitter ~ x
Reply With Quote
  #390    
Old June 3rd, 2011 (8:00 PM).
jigglyppuff8's Avatar
jigglyppuff8 jigglyppuff8 is offline
 
Join Date: Jun 2007
Location: PA, USA :effort
Age: 22
Gender: Male
Nature: Modest
Posts: 2,326

It's the border-radius property. Basically, you just use "border-radius: *desired radius length*;"

[css-div="padding: 2px 2px 2px 2px; color: #black; background-color: red; border-radius:8px;"]Blarg blarg blarg. This is the stuff in my box. blargy[/css-div]

Blarg blarg blarg. This is the stuff in my box. blargy

__________________
迷いながらトキメイタ 
記憶は儚くて消えないで

Reply With Quote
  #391    
Old June 3rd, 2011 (8:02 PM).
donavannj's Avatar
donavannj donavannj is offline

Nico Nico Nii!~

ModeratorCSEO
 
Join Date: Mar 2005
Location: Otonokizaka
Age: 25
Gender: Male
Posts: 18,755

Kevin beat me to it.

But I'd like to suggest not using that shade of red. It's blindingly bright.

__________________

Original vector used for avatar credit to /u/judealonzo01 on Reddit via /r/SchoolIdolFestival
GIF credits to an unknown individual for original; machomuu for resizing
Avatar Featuring Nico Yazawa from Love Live! School Idol Festival
Signature Featuring Nico Yazawa and Maki Nishikino from the same series
Reply With Quote
  #392    
Old June 3rd, 2011 (8:07 PM).
Xyrin's Avatar
Xyrin Xyrin is offline
Furret
Gold Tier
 
Join Date: May 2008
Location: Northern Indiana, USA
Age: 17
Gender: Male
Nature: Jolly
Posts: 1,065

Quote originally posted by donavannj:
Kevin beat me to it.

But I'd like to suggest not using that shade of red. It's blindingly bright.

Okay. I'll use a darker one. I never noticed it was so bright until I actually looked at it.

__________________

Furret


The Creeper Hub ~ x - Icons by Anastasia - My Twitter ~ x
Reply With Quote
  #393    
Old June 4th, 2011 (8:34 AM).
pokewalker's Avatar
pokewalker pokewalker is offline
If it ain't Dutch,it ain'tmuch
Silver Tier
 
Join Date: Jun 2010
Location: Netherlands
Age: 19
Gender: Male
Nature: Jolly
Posts: 669

Well I basically have a very weird glitch. Maybe someone knows? It breaks through the border

All of my shinies
(click them to view)

PHP Code:
[CENTER][css-div="height: 300px; width: 500px; background-color: #000000; border-radius: 75px; border-top-left-radius: 50px; border-bottom-right-radius: 50px; border-style:ridge; border-color: blue; border-width:5px; padding: 5px;"][center][FONT="Arial Black"][COLOR="White"]All of my shinies
[SIZE="1"](click them to view)[/SIZE]
[
css-div=" border-style:solid;
border-color:#EAFF00; border-width:1.5px; height: 96px; width: 96px;"
][IMG]http://img89.imageshack.us/img89/9177/crobat.png[/IMG][/css-div][css-div=" border-style:solid;
border-color:#EAFF00; border-width:1.5px; height: 96px; width: 96px;"][IMG]http://img818.imageshack.us/img818/8200/amoonguss.png[/IMG][/css-div][css-div=" border-style:solid;
border-color:#EAFF00; border-width:1.5px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=z1NvXwm5spE&feature=channel_video_title"][IMG]http://img651.imageshack.us/img651/9154/typhlosionshiny.png[/IMG][/URL][/css-div][css-div=" border-style:solid;
border-color:#EAFF00; border-width:1.5px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=wgiCGUxN5Cs&feature=channel_video_title"][IMG]http://img109.imageshack.us/img109/8789/cresseliae.png[/IMG][/URL][/css-div][css-div=" border-style:solid;
border-color:#EAFF00; border-width:1.5px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=jIfbrmhEt-s&feature=channel_video_title"][IMG]http://img695.imageshack.us/img695/622/jellicent.png[/IMG][/URL][/css-div][css-div=" border-style:solid;
border-color:#EAFF00; border-width:1.5px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=3ImY0FGN6Hw&feature=channel_video_title"][IMG]http://img864.imageshack.us/img864/5059/audino.png[/IMG][/URL][/css-div][/COLOR][/FONT][/CENTER][/css-div][/CENTER] 

__________________
Reply With Quote
  #394    
Old June 4th, 2011 (9:19 AM).
jigglyppuff8's Avatar
jigglyppuff8 jigglyppuff8 is offline
 
Join Date: Jun 2007
Location: PA, USA :effort
Age: 22
Gender: Male
Nature: Modest
Posts: 2,326

All of my shinies
(click them to view)

Putting one div after another usually results in a line break. Example

[cd=height:auto;]Here's one div [/cd][cd=height:auto; text-decoration: blink;]and here's another div immediately following it.[/cd]

Here's one div
and here's another div immediately following it.

What I did was add the display:inline; property to properly align them one after the other.

[cd=height:auto; display:inline;]Here's one div [/cd][cd=height:auto;display:inline; text-decoration: blink;]and here's another div immediately following it.[/cd]

Here's one div
and here's another div immediately following it.

Also, I would highly recommend NOT using line breaks in PC's CSS. As for the borders, I'm not really sure what happened there.

Spoiler:
[CENTER][css-div="height: 300px; width: 500px; background-color: #000000; border-radius: 75px; border-top-left-radius: 50px; border-bottom-right-radius: 50px; border-style:ridge; border-color: blue; border-width:5px; padding: 5px;"][center][FONT="Arial Black"][COLOR="White"]All of my shinies
[SIZE="1"](click them to view)[/SIZE]
[css-div="display:inline; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][IMG]http://img89.imageshack.us/img89/9177/crobat.png[/IMG][/css-div][css-div="display:inline; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][IMG]http://img818.imageshack.us/img818/8200/amoonguss.png[/IMG][/css-div][css-div="display:inline; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=z1NvXwm5spE&feature=channel_video_title"][IMG]http://img651.imageshack.us/img651/9154/typhlosionshiny.png[/IMG][/URL][/css-div][css-div="display:inline; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=wgiCGUxN5Cs&feature=channel_video_title"][IMG]http://img109.imageshack.us/img109/8789/cresseliae.png[/IMG][/URL][/css-div][css-div="display:inline; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=jIfbrmhEt-s&feature=channel_video_title"][IMG]http://img695.imageshack.us/img695/622/jellicent.png[/IMG][/URL][/css-div][css-div="display:inline; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=3ImY0FGN6Hw&feature=channel_video_title"][IMG]http://img864.imageshack.us/img864/5059/audino.png[/IMG][/URL][/css-div][/COLOR][/FONT][/CENTER][/css-div][/CENTER]

__________________
迷いながらトキメイタ 
記憶は儚くて消えないで

Reply With Quote
  #395    
Old June 4th, 2011 (10:13 AM).
Liliana Vess's Avatar
Liliana Vess Liliana Vess is offline
My Secrecy. My Advantage.
Platinum Tier
 
Join Date: Nov 2008
Location: «UK»
Gender: Male
Posts: 1,983

If you use display:inline-block; instead then you won't get those glitched up borders ^-^

__________________


"I am confident that if anyone actually penetrates our facades, even the most perceptive would still be fundamentally unprepared for the truth of House Dimir."
-Szadek, Lord of Secrets

Reply With Quote
  #396    
Old June 4th, 2011 (10:42 AM).
pokewalker's Avatar
pokewalker pokewalker is offline
If it ain't Dutch,it ain'tmuch
Silver Tier
 
Join Date: Jun 2010
Location: Netherlands
Age: 19
Gender: Male
Nature: Jolly
Posts: 669

Ok now I have an very not understandable other glitch. lol.

All of my shinies
(click them to view)


My teacher

PHP Code:
[SIZE="4"][CENTER][css-div="height: 300px; width: 500px; background-color: #000000; border-radius: 75px; border-top-left-radius: 50px; border-bottom-right-radius: 50px; border-style:ridge; border-color: green; border-width:5px; padding: 5px;"][center][FONT="BN Machine"][COLOR="White"]All of my shinies
[SIZE="1"](click them to view)[/SIZE]
[
css-div="border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][IMG]http://img89.imageshack.us/img89/9177/crobat.png[/IMG][/css-div][css-div="display:inline-block; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][IMG]http://img818.imageshack.us/img818/8200/amoonguss.png[/IMG][/css-div][css-div="display:inline-block; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=z1NvXwm5spE&feature=channel_video_title"][IMG]http://img651.imageshack.us/img651/9154/typhlosionshiny.png[/IMG][/URL][/css-div][css-div="display:inline-block; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"]
[URL="http://www.youtube.com/watch?v=wgiCGUxN5Cs&feature=channel_video_title"][IMG]http://img109.imageshack.us/img109/8789/cresseliae.png[/IMG][/URL][/css-div][css-div="display:inline-block; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=jIfbrmhEt-s&feature=channel_video_title"][IMG]http://img695.imageshack.us/img695/622/jellicent.png[/IMG][/URL][/css-div][css-div="display:inline-block; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][URL="http://www.youtube.com/watch?v=3ImY0FGN6Hw&feature=channel_video_title"][IMG]http://img864.imageshack.us/img864/5059/audino.png[/IMG][/URL]
[/css-div][/COLOR][/FONT][COLOR="White"][css-div="display:inline-block; border-style:solid; border-color:#EAFF00; border-width:1px; height: 96px; width: 96px;"][/css-div][FONT="BN Machine"]My [URL="http://www.pokecommunity.com/member.php?u=119663"][COLOR="Green"][B]teacher[/B][/COLOR][/URL][/FONT][URL="http://www.pokecommunity.com/member.php?u=119663"][/URL][/COLOR][/center][/css-div][center][COLOR="White"][/COLOR][/CENTER][/CENTER][/SIZE

What's basically happening is that the My Teacher part is felling out of my signature, and there is a seperate border without anything in it too. Any suggestions?

__________________
Reply With Quote
  #397    
Old June 5th, 2011 (10:17 PM).
o3o's Avatar
o3o o3o is offline
 
Gold Tier
 
Join Date: Mar 2011
Location: Equestria, Ponyville, Sugarcube Corner
Gender: Female
Nature: Jolly
Posts: 291
Send a message via Windows Live Messenger to o3o

Hey, I'm having this problem with my signature where the quote, multiquote, etc. buttons are showing up alongside or in the middle of my signature.~ I used the float:left property for both the image and the text, so could that have anything to do with it? Thanks. Oh, and it doesn't seem to happen in Firefox, only in other browsers such as Chrome or Safari.

__________________

pinkie pie.

Reply With Quote
  #398    
Old June 6th, 2011 (4:59 AM).
donavannj's Avatar
donavannj donavannj is offline

Nico Nico Nii!~

ModeratorCSEO
 
Join Date: Mar 2005
Location: Otonokizaka
Age: 25
Gender: Male
Posts: 18,755

Yes, that would be the float:left causing that, most likely.

__________________

Original vector used for avatar credit to /u/judealonzo01 on Reddit via /r/SchoolIdolFestival
GIF credits to an unknown individual for original; machomuu for resizing
Avatar Featuring Nico Yazawa from Love Live! School Idol Festival
Signature Featuring Nico Yazawa and Maki Nishikino from the same series
Reply With Quote
  #399    
Old June 14th, 2011 (11:58 PM).
champagnepapi's Avatar
champagnepapi champagnepapi is offline
exile
Gold Tier
 
Join Date: Nov 2010
Location: new england
Gender: Male
Nature: Adamant
Posts: 1,796

Code:
css-div="background-image:url('http://i980.photobucket.com/albums/ae289/CKmaster/chompyplates.png'); width: 300 px; height: 181 px;"][/css-div

So, what did I do wrong with the above code? I removed the brackets on purpose just to display the code, they're intact in the actual thing.

__________________

paired to kaori & vrai
Reply With Quote
  #400    
Old June 15th, 2011 (3:07 AM).
Liliana Vess's Avatar
Liliana Vess Liliana Vess is offline
My Secrecy. My Advantage.
Platinum Tier
 
Join Date: Nov 2008
Location: «UK»
Gender: Male
Posts: 1,983

Dont put a space in between the number and the px
It needs to look like this width: 300px; not width: 300 px;

__________________


"I am confident that if anyone actually penetrates our facades, even the most perceptive would still be fundamentally unprepared for the truth of House Dimir."
-Szadek, Lord of Secrets

Reply With Quote
Reply
Quick Reply

Sponsored Links
Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT -8. The time now is 11:10 AM.