diffrences between local site and server. the html and css the same

derrida
derrida used Ask the Experts™
on
Hi
something bizzare and i can't find why it happens.
on my local machine i have the html and css and all looks great. but when i upload it to the server the sname element doesn't look the same.
by the way when i play with firebug on the local site every rule makes a different, but on the server if i uncheck or check some rules it doesn't have any effect.
it is a ul that is created via an ajax call. again html and css are exactly the same. here is the code:
            ul{
                list-style: none;
                display: table;
                margin: 2.5em auto 0;
}
                li{
                    display: table-cell;
                    padding: 0.2em 1.5em;
}
.badge{
    padding: 4px 7px !important;
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.25);
     transition: all 0.2s linear;
     margin-bottom: 1em;
    &:hover{
        border-radius: 0;
        box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.45);
     }
}
.sname{
      margin-right: -35px;
    margin-top: 20px;
    text-align: center;
    word-wrap: break-word;
    width: 100px;
    font-size: 1.2em;
    font-weight: bold;
}

Open in new window


i am attaching images one from the locale and one from the server. any idea what's going on there?
on the server the sname element is wrongon local it looks ok
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Dave BaldwinFixer of Problems
Most Valuable Expert 2014

Commented:
You are probably loading 'custom.css' from an external file.  I suspect that what you are seeing is the browser cached an old version and since the name remains the same, it loading the old version from cache and not loading the new version from the server.  This is a common problem.  Load 'custom.css' in your browser from the server and refresh that page.  Then go back to your HTML page and you should see the newest version.

Author

Commented:
hi
first thanks for answering. i have cleared the cache several times and tested on several browsers. still the same. also, as i said, the new css is there when i check in firebug.

Author

Commented:
i just can't understand why on my local site in firebug i change values and it is reflected and on the server side it is not. no matter if i change values or disable a rule it is uneffected.
Ensure you’re charging the right price for your IT

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

Dave BaldwinFixer of Problems
Most Valuable Expert 2014

Commented:
Firebug is only in Firefox and has nothing to do with the server.  You're getting confusing.  If you see the 'new' CSS in Firebug when you are looking at the code on the server then you should see the effects in your page on the server.

Author

Commented:
yes, that is what i don't see. the new css is in firebug when i check the page on the server, yet when i try to change values or turn off it has no effect. by the way, the same in chrome dev tools, i just prefer firebug.
Commented:
ok went another way. positioned the sname element absolute.

Author

Commented:
fixed it

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial