Everything seems to be displaying larger online (heroku) than running on localhost. Text, buttons, images, everything. I am using chrome to access both versions. Any reason this may be?
Related
I'm working on a project. So first, i started with front-end. And then after finishing that, i loaded all the files in django app and started the localhost. But suddenly everything seems to be bigger. Most of the padding, margin, font-size, changes from small to big
I have disabled cache, recoded all the static linkings
1.front end designed locally is the first image.
2.frond end after loading into localhost is the second image
Why is this happening, is there any solution for this. Do I have to redesign all on the perspective of localhost AGAIN?
I am building a website.
I built it locally, it works both in Chrome and in Firefox (when navigating the files locally)
I uploaded the files to amazon s3
and here's where I get some funky behavior.
if I use the amazon endpoint url to access the site:
it doesn't display properly in chrome, but it does in firefox. (what I mean by doesn't display properly is that parts of my css aren't being loaded in chrome, but they are being loaded in firefox)
if i navigate the local files on my machine:
it works just fine in both chrome and firefox. Everything is displayed perfectly fine and all of the css gets pulled in and rendered.
I guess what I'm curious about is, would behavior like this be an issue with Chrome or with Amazon AWS?
If parts of my css aren't even being pulled in by chrome (as in, when I open the developer tools, the css lines don't appear and I just get the default css associated with tags), it seems like this would be an issue with either chrome or AWS.
but when I use navigate the files locally in chrome, everything works just fine. So now I can eliminate Chrome as the culprit and point the finger at AWS.
But then when I use the aws endpoint in Firefox, it works just fine again...
So AWS isn't to blame either?
Im just curious why I'm getting different behavior based on how i choose to open the files, even though the files are the same both locally and on amason s3
UPDATE: So I sent an invalidation through cloudfront distribution.
Now when I visit the domain that I own and run the site off of, everything works both in chrome and firefox.
But the Amazon AWS Endpoint is still displaying improperly in Chrome despite the fact that the regular domain works... In the end, nothing is broken when the end user visits the site or when I edit the site locally, so it seems that the amazon endpoint is to blame.
If anyone has any ideas, now I'm just curious what the hell is happening inside of AWS
I have this annoying CSS rendering issue that I am not sure what is causing it.
on my local copy everything looks that way I want it. When I deploy it to the server IIS.
there is one minor very minor DIV that is not rendering the way I want it or the same is what the local copy renders.
In this case, there is a padding on top and bottom of the div when there should not be. It looks fine in the local.
I tried setting the X-AU in the header but that did not help.
It is only rending that one div differently. all of the other elements looks fine. This is really strange.
Have you tried to disable IIS static content compression?
I already had issues with minified jquery and css on servers running IIS and I had to change it to non-minified versions of it.
Can you check if on your local you are running the site using SSL? I had a similar issue. I was running the site within VS 2013 and local IIS over SSL and on the live site, I was not. Fix was to configure https bindings on the live site and this fixed the issue.
I'm getting a weird issue involving IIS and IE, and I'll try to describe it clearly.
I have a regular html-css-js/jquery website that I've developed locally. Now that it's ready, I'm trying to deploy it on a server.
Once it's hosted on the server, I see two problems in IE only:
The rendering is slightly different: there's a few pixels of additional white space all around my website (so the contents is actually more 'compressed' than when viewed locally).
Some JS issues: I'm using the Impromptu jQuery popup plug-in, and the callback I specify in its 'loaded' event pre-populates its forms fields. In FF it works, but in IE the fields don't get populated until I close the popup and open it again. This worked locally on all browsers.
As weird as it sounds, the text in my jQuery popup dialog does not seem to have the 'ClearType' technology applied. The text is like '1 pixel thin' and not anti-aliased like everywhere else.
I have uploaded my website to another server and it runs perfectly fine. The issue is that I need to put it on the first server and I don't know what's wrong. Both servers are on Win 2k3 with IIS 6, .NET 3.5.
Any pointers as to what is going wrong? Thanks a lot.
Make sure that the "security zone" in the Internet Explorer status bar is the same when viewing the site between the 2 servers.
Use the IE developer toolbar to debug your css. Could also be a caching issue if it looks like an older version.
http://www.microsoft.com/downloads/en/details.aspx?FamilyID=95e06cbe-4940-4218-b75d-b8856fced535
I'm working on a site that will go on my company's intranet. I developed it locally on my computer, checking it in different browsers and on colleague's computers, and when it was done I handed it off to IT. They put identical copies on a staging server, and on the production server. This is a site built only with html, javascript, and css. No server side scripting. It also uses a DWF viewer plugin from Autodesk. It is a single standalone page (not part of a CMS) that allows users to load drawings into the viewer and then click to see info from a database of space info saved in a series of js arrays (the space DB software spits out a js file with all the info listed in array literals, creating a crap ton of global variables - ugh, but I digress).
When I followed their links (using IE 8) the version on the staging server looked as expected, but the layout is hosed on the version from the production server. Specifically, it seems like a div that is supposed to flow to the right of a div that is float: left is displaying below the floated div at full width, as though it was clear: left (which it is not). It also has the wrong height.
I downloaded the files from each and they are identical to my local version. Frustrated, I cleared my browser's cache, restarted my computer, checked it on a colleague's computer who also has IE 8. All the same issue. Staging server good. Production server bad.
Finally I uninstalled IE 8 and looked at it in IE 6. Both versions looked fine.
So, to recap. Two different servers. No server side scripting. Identical files. One browser agrees they are identical, the other does not. What could cause this?
Have you checked that IE8 isn't rendering it in compatibility view (IE7 rendering)? By default IE8 renders things in the "Intranet Zone" in compatibility view with everything else in normal mode.
You can change the mode with the little broken page button to the right of the URL bar.
Apart from the compatibility setting, other things that could differ from computer to computer for an identical page:
Font size. Windows allows system-wide font resizing, impacting layouts. It could account for the second div falling underneath the first one.
Resolution. Could it be a resolution issue? Could also account for the div problem.