The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Personalized Spoiler

View previous topic View next topic Go down

Solved Personalized Spoiler

Post by Ellianna17 on July 21st 2015, 12:01 pm

Hello,

Right now, the spoilers in my forum looks like this:

Problem with it:
> When the content inside the spoiler is hidden, there is a line below the inner box that is not supposed to be there. I would like to remove it and make the background of the inner box a different shade of blue.
> When you open the spoiler, it is like there is a smaller box placed on top of the inner box which displays the content. It has borders, too. I would like to remove it and instead make the background of the inner box white.
In other words, I'd like to make it look like this:

The address of my forum, together with its forum version, is located at my profile. If you need the code of the spoiler, please tell me and I would supply it. Mr. Green

Titania


Last edited by Titania on July 22nd 2015, 12:18 pm; edited 1 time in total

Ellianna17
Forumember

Female Posts : 539
Reputation : 124
Language : English, Filipino, and Basic Spanish

http://winxclub.site-forums.com

Back to top Go down

Solved Re: Personalized Spoiler

Post by Pizza Boi on July 21st 2015, 12:10 pm

Hi Very Happy

Can you please link me to a topic when you used the spoiler tag?

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: Personalized Spoiler

Post by Ellianna17 on July 21st 2015, 1:39 pm


Ellianna17
Forumember

Female Posts : 539
Reputation : 124
Language : English, Filipino, and Basic Spanish

http://winxclub.site-forums.com

Back to top Go down

Solved Re: Personalized Spoiler

Post by Pizza Boi on July 21st 2015, 5:58 pm

Hi Very Happy

The second one (With contents visible) really is a border and it's because you have 2 .spoiler_content active. If you null both of them or change one of them into #FAFAFA and add !Important after, you'll be able to fix your problem. Add these extra commands too:

Code:
  width: 99.6%;
  position: relative;
  right: 2px;

Also, if you abolish the border command, it will lead to an undesirable result.

For the first one, you have 4 declarations of .codebox dd. Play with the codes found there and you should be able to get your desired result. I nulled the border code in all 4 of them and it removed the border for me Smile .

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: Personalized Spoiler

Post by Ellianna17 on July 22nd 2015, 10:02 am

I don't have .spoiler-content active code...^^"

Ellianna17
Forumember

Female Posts : 539
Reputation : 124
Language : English, Filipino, and Basic Spanish

http://winxclub.site-forums.com

Back to top Go down

Solved Re: Personalized Spoiler

Post by Pizza Boi on July 22nd 2015, 10:07 am

Hi Very Happy

Wow... that's odd. Maybe it's in your templates fufufu... just declare a value for spoiler code and add the attachments I said.

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Solved Re: Personalized Spoiler

Post by Ange Tuteur on July 22nd 2015, 10:51 am

Hi @Titania,

Add the following rules to your stylesheet :
Code:
.codebox.spoiler > dd {
  border:none;
  box-shadow:none;
  background:none;
  padding:0;
}

.codebox.spoiler .spoiler_closed, .spoiler_content {
  background:#ADE0FD;
  border:1px solid #4779A5;
  box-shadow:3px 2px 2px #878787
}

.spoiler_content { background:#FFF }

That should give you the result you wanted.

Also, the second border is actually just the container for the spoiler content. It was mostly styled by .codebox dd ( which had a border ), however that can be overridden by utilizing the .spoiler classname.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Personalized Spoiler

Post by Ellianna17 on July 22nd 2015, 12:17 pm

That did the trick! Thank you both so much for your help, @Ange Tuteur and @Pizza Boi!

Ellianna17
Forumember

Female Posts : 539
Reputation : 124
Language : English, Filipino, and Basic Spanish

http://winxclub.site-forums.com

Back to top Go down

Solved Re: Personalized Spoiler

Post by APE on July 22nd 2015, 12:55 pm

Topic solved and archived





APE
Manager
Manager

Male Posts : 8636
Reputation : 757
Language : fluent in dork / mumbojumbo & English haha
Location : STUCK IN FORUMOTIONS SERVERS HELP ME !!!!!!

http://chatworld.forumotion.co.uk/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum