XF 1.5 extra.css not working

Senpai · Mar 7, 2017

im not really sure if this is a bug or i was the one who caused it but whenever i add code to extra.css my forum doesn't read it

Code:

/* shake it baby */
@-webkit-keyframes spaceboots {
0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}
.shake:hover,
.shake:focus {
-webkit-animation-name: spaceboots;
-webkit-animation-duration: 0.8s;
-webkit-transform-origin:50% 50%;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
}
.shake {
display:inline-block
}

/* editor message */
.wnr2 {
color: #99a0a8;
}
.c_bad {
color: red;
}



.awesome {
      font-family: futura;
      font-style: italic;
      width:100%;
      margin: 0 auto;
      text-align: center;
      color:#f20000;
      font-size:16px;
      font-weight: bold;
      -webkit-animation:colorchange 3s infinite alternate;
    }

    @-webkit-keyframes colorchange {
      50% {
       
        color: red;
      }
     
      100% {
       
        color: #17687c;
      }



}
::-webkit-scrollbar {
    background: #2c2c2c; 
    width: 12px;

}
::-webkit-scrollbar-track {

}
::-webkit-scrollbar-thumb {
    background: #17687c; 
    -webkit-box-shadow: inset 0 0 6px rgba(23, 104, 124); 
}
::-webkit-scrollbar-thumb:hover {
    background: #17687c; 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(0,0,0,0.6); 
}
@-webkit-keyframes headershine {
    0%        { opacity: 0.4; }
    50%        { opacity: 1; }
    100%     { opacity: 0.4; }
}

/* User Rank Images: Prolapse */
.userrank {
    display: block;
    margin-left: 16px;
}

.ownerinfo {
    border-top: 1px dotted #000;
    display: block;
    margin-left: 4px;
}

.message .messageUserBlock .userBanner { display: none; }




}

.pleasesearchbeforeask {
    width: 151px;
    padding: 4px 0px;
    text-align: center;
    border-radius: 3px;
    font-size: 11px;
    text-shadow: none;
    text-transform: uppercase;
    margin: 0 auto;
    font-weight: 500;
    background: #131313;
    color: #00fa2f;
    margin-right: 29px;
    text-shadow: 0px 0px 8px #00fa2f;
    position: absolute;
    right: -29px;
    width: 148px;
    /* wolfs css dont change */
}

.ramzan {
    padding: 6px 457px;
    text-align: center;
    border-radius: 0px;
    font-size: 11px;
    text-shadow: none;
    /* margin: 0 auto; */
    font-weight: 510x;
    background: #f17405;
    color: #000000;
    margin-right: -178px;
    right: 50px;
    margin-left: -18px;
    text-decoration: none;
    /* wolfs css dont change */ 
    }

nothing seems to work it was working before but not anymore damn

could someone please help

M@rc · Mar 7, 2017

Try adding !important right before every ;

Russ · Mar 7, 2017

M@rc said:
Try adding !important right before every ;

That's not exactly how it works, !important doesn't need to be used all the time. If XenForo has say...

Code:

.messageText { font-size: 12px; }

Rather than putting an important! you could just use a higher CSS selector.

Code:

.message .messageText { font-size: 14px; }

Giving your CSS the higher priority.

@Senpai I'm seeing an extra closing bracket after: .message .messageUserBlock .userBanner { display: none; } which could cause some problems.

Senpai · Mar 7, 2017

Russ said:
That's not exactly how it works, !important doesn't need to be used all the time. If XenForo has say...

Code:

.messageText { font-size: 12px; }

Rather than putting an important! you could just use a higher CSS selector.

Code:

.message .messageText { font-size: 14px; }

Giving your CSS the higher priority.

@Senpai I'm seeing an extra closing bracket after: .message .messageUserBlock .userBanner { display: none; } which could cause some problems.

thanks for trying to help me out bro im gonna look at that now

Senpai · Mar 7, 2017

Russ said:
That's not exactly how it works, !important doesn't need to be used all the time. If XenForo has say...

Code:

.messageText { font-size: 12px; }

Rather than putting an important! you could just use a higher CSS selector.

Code:

.message .messageText { font-size: 14px; }

Giving your CSS the higher priority.

@Senpai I'm seeing an extra closing bracket after: .message .messageUserBlock .userBanner { display: none; } which could cause some problems.

ahh ******** it still didn't work what is causing this yesterday it was fine and now it decided to break

Senpai · Mar 7, 2017

not even !important seems to work what is going on ********

gwordz · Mar 9, 2017

@Senpai I know this might seem obvious but sometimes the obvious things are the easiest to miss...Are you sure you are adding to the EXTRA.css of the current theme and not another theme you have installed?

Senpai · Mar 9, 2017

gwordz said:
@Senpai I know this might seem obvious but sometimes the obvious things are the easiest to miss...Are you sure you are adding to the EXTRA.css of the current theme and not another theme you have installed?

literally this is a bug not even user colors work

Chris D · Mar 9, 2017

Can you provide a URL where this code can be seen in action and explain what the expected results are?

Senpai · Mar 9, 2017

Chris D said:
Can you provide a URL where this code can be seen in action and explain what the expected results are?

look at my latest thread css doesnt work at all

Ozzy47 · Mar 9, 2017

That's not what he asked.

TsinJu · Mar 9, 2017

Russ said:
Rather than putting an important! you could just use a higher CSS selector.

Code:

.message .messageText { font-size: 14px; }

@Senpai you should read

Optic · Mar 9, 2017

Senpai said:
.shake { display:inline-block }

You have a syntax error that is cutting off almost all of your EXTRA.CSS ..

.shake is missing a semi-colon ; at the end ..

Senpai · Mar 9, 2017

Optic said:
You have a syntax error that is cutting off almost all of your EXTRA.CSS ..

.shake is missing a semi-colon ; at the end ..

that didnt work either my user group css nothing works at all i thought it was only extra css

Optic · Mar 10, 2017

You must have a typo or missing opening/closing { } somewhere..

Copy and paste your whole EXTRA.CSS into a text file on your device, then empty EXTRA.CSS on your XenForo..

Then slowly add each section one by one - you should be able to find the typo that way..

Optic · Mar 10, 2017

Also font-weight in .ramzan has a typo, you're missing px:

Rich (BB code):

.ramzan {
    padding: 6px 457px;
    text-align: center;
    border-radius: 0px;
    font-size: 11px;
    text-shadow: none;
    /* margin: 0 auto; */
    font-weight: 510x;
    background: #f17405;
    color: #000000;
    margin-right: -178px;
    right: 50px;
    margin-left: -18px;
    text-decoration: none;
    /* wolfs css dont change */
    }

Chris D · Mar 10, 2017

Chris D said:
Can you provide a URL where this code can be seen in action and explain what the expected results are?

Offer still stands. If we can see the code in action, it may become patently clear where the issue lies.

Lawrence · Mar 10, 2017

@Senpai you have a "}" two lines below this css line:
.message .messageUserBlock .userBanner { display: none; }

Mr Lucky · Mar 10, 2017

Lawrence said:
@Senpai you have a "}" two lines below this css line:
.message .messageUserBlock .userBanner { display: none; }

Yes. This was mentioned by Russ in post #3 so presumably Senpai fixed that. If not then that does explain everything.

An extra curly bracket will screw the whole thing.

These things can be sorted by removing all code and adding back in bit by bit, or check the code here:

http://jigsaw.w3.org/css-validator/

Senpai · Mar 10, 2017

Mr Lucky said:
Yes. This was mentioned by Russ in post #3 so presumably Senpai fixed that. If not then that does explain everything.

An extra curly bracket will screw the whole thing.

These things can be sorted by removing all code and adding back in bit by bit, or check the code here:

http://jigsaw.w3.org/css-validator/

i done what you said and then i reported it to my hoster he said its to do with cloudflare

XF 1.5 extra.css not working

Well-known member

Well-known member

Well-known member

Well-known member

Well-known member

Well-known member

Member

Well-known member

XenForo developer

Well-known member

Well-known member

Well-known member

Well-known member

Well-known member

Well-known member

Well-known member

XenForo developer

Well-known member

Well-known member

Well-known member

Similar threads

We value your privacy