Welcome to Gaia! ::


Tipsy Star

6,750 Points
  • Tipsy 100
  • Cats vs Dogs 100
  • Contributor 150
I'm attempting to make a sloppy, ugly profile for the first time ever. I'd like to think that it's not going that horribly so far, but I'm having some trouble getting rid of some uh... lines.

I've searched through several guides and haven't found a thing.

Could someone be so kind as to tell me what code is used to rid my profile of these pesky lines/blocky white box, or point me in the right direction? Please and thank you<3


edit: here's a link to what I'm talking about... just in case that for some reason, it won't show up for others.:

link to pic

I'm using Chrome.

Saxy Coder

▧▧▧ ♬ ▧▧▧
First off, make sure you have your theme set to "Custom" over here?
If you don't have that done, it sometimes creates random lines like that.

I'm not entirely familiar with Classic coding, but the selectors for the lines are:
  • #profile.section ( or #site #content #sidebar #profile.section )
    This is the white area in the top left. Specifically, that selector has a white background which you want to make transparent.
  • #content ( or #site #content )
    This is the gray vertical line -- this area has a default border-right which you want to get rid of

▧▧▧▧▧▧▧

Tipsy Star

6,750 Points
  • Tipsy 100
  • Cats vs Dogs 100
  • Contributor 150
Lady Saxophone
▧▧▧ ♬ ▧▧▧
First off, make sure you have your theme set to "Custom" over here?
If you don't have that done, it sometimes creates random lines like that.

I'm not entirely familiar with Classic coding, but the selectors for the lines are:
  • #profile.section ( or #site #content #sidebar #profile.section )
    This is the white area in the top left. Specifically, that selector has a white background which you want to make transparent.
  • #content ( or #site #content )
    This is the gray vertical line -- this area has a default border-right which you want to get rid of

▧▧▧▧▧▧▧


Yeah, it's set to custom.

I've tried making these areas transparent, but no change. sad

Prismatic Unicorn

76,950 Points
  • Fairy bread fancier 500
  • Just A Regular User 500
  • Wing Mastery 100
NovenaRelic


Yeah, it's set to custom.

I've tried making these areas transparent, but no change. sad

Having a look at your profile, it seems like the small white box belongs to the more general #profile selector, so if you set the background on that to transparent, it will hopefully get rid of the box

The grey line is the border of the #content selector, so you need to set the border on that to transparent or 0px (either will make it invisible). So, you'd want to use

#content{border: 0px;}

And just as a general development/learning thing, did you know that with CSS it's possible to string selectors together and give them the same instructions using commas? So, instead of having to write out

#extendedProfileBody #header h1 {display: none}
#about h2 {display: none}
#friends {display: none}


and so on, you can instead use code like

#extendedProfileBody #header h1, #about h2, #friends{display:none;}


It's not by any means compulsory, but it can help keep things neater and reduce the number of lines of coding you use.

Tipsy Star

6,750 Points
  • Tipsy 100
  • Cats vs Dogs 100
  • Contributor 150
Zzyli
NovenaRelic


Yeah, it's set to custom.

I've tried making these areas transparent, but no change. sad

Having a look at your profile, it seems like the small white box belongs to the more general #profile selector, so if you set the background on that to transparent, it will hopefully get rid of the box

The grey line is the border of the #content selector, so you need to set the border on that to transparent or 0px (either will make it invisible). So, you'd want to use

#content{border: 0px;}

And just as a general development/learning thing, did you know that with CSS it's possible to string selectors together and give them the same instructions using commas? So, instead of having to write out

#extendedProfileBody #header h1 {display: none}
#about h2 {display: none}
#friends {display: none}


and so on, you can instead use code like

#extendedProfileBody #header h1, #about h2, #friends{display:none;}


It's not by any means compulsory, but it can help keep things neater and reduce the number of lines of coding you use.


Oh, great, thanks!

One thing, though... While I was able to get rid of the white line, it also removed my avatar. Is there a way to remove one part but not the other?

Yeah, I know about being able to shorten it... There's still a few things I want to add to it at some point or another, so to be able to reduce confusion, I haven't shortened anything just yet.

Prismatic Unicorn

76,950 Points
  • Fairy bread fancier 500
  • Just A Regular User 500
  • Wing Mastery 100
NovenaRelic


Oh, great, thanks!

One thing, though... While I was able to get rid of the white line, it also removed my avatar. Is there a way to remove one part but not the other?

Yeah, I know about being able to shorten it... There's still a few things I want to add to it at some point or another, so to be able to reduce confusion, I haven't shortened anything just yet.

You should be able to keep your avatar and any other content from that part of your profile by setting the background to transparent instead of hiding the element.

So, use
#profile{background: transparent;}


Oh, it's totally fine. It's just that often people don't realise that you can shorten your code like that (I know it took me a while to find this piece of information out). You're not presenting the code to a client or working as part of a collaboration, so basically you can do whatever makes the most sense to you!

Tipsy Star

6,750 Points
  • Tipsy 100
  • Cats vs Dogs 100
  • Contributor 150
Zzyli
NovenaRelic


Oh, great, thanks!

One thing, though... While I was able to get rid of the white line, it also removed my avatar. Is there a way to remove one part but not the other?

Yeah, I know about being able to shorten it... There's still a few things I want to add to it at some point or another, so to be able to reduce confusion, I haven't shortened anything just yet.

You should be able to keep your avatar and any other content from that part of your profile by setting the background to transparent instead of hiding the element.

So, use
#profile{background: transparent;}


Oh, it's totally fine. It's just that often people don't realise that you can shorten your code like that (I know it took me a while to find this piece of information out). You're not presenting the code to a client or working as part of a collaboration, so basically you can do whatever makes the most sense to you!


Oh, jeeze, I derped. Hahaha. I haven't had enough coffee yet, I guess. Thank you! xD

My mom used to do a lot of coding a few years ago and I picked up a few things from that. (Sadly, she had no idea what it is this site uses, so her helping was pretty well pointless.) I would like to do coding for people some day, but I need a bit more experience before I get to that point.

Thank you very much again~!

Quick Reply

Submit
Manage Your Items
Other Stuff
Get GCash
Offers
Get Items
More Items
Where Everyone Hangs Out
Other Community Areas
Virtual Spaces
Fun Stuff
Gaia's Games
Mini-Games
Play with GCash
Play with Platinum