The indentation in IE6 and Google Chrome - html

I have a problem with the site http://www.kotoki.ru . If you go to the home page in IE6 or Google Chrome, then we can note from the top margin (which is not clear where did) as soon go to the page http://kotoki.ru/moony/ margin disappears. Why is this and how to get rid of it on the main page kotoki.ru ? I tried to solve the problem himself, using firebug, but nothing succeeded.

Change the encoding of your index file to UTF-8. The empty line at the top is there because of the UTF-8 byte order mark being rendered in the screen.
If, in Firefox, you change the encoding to "Western ISO-8859-1" you will see the same margin with the UTF-8 byte order marked being rendered in the screen. Now in Chrome and IE6 the actual characters aren't there, but the margin is, so somehow the browser thinks that your document is not UTF-8 and renders the byte order mark.
Also a thing I noticed is that one of your meta tags has attributes with single quotes ', which is not allowed in XHTML, attributes should have double quotes ".

In firefox there is no problem with either margin, however it could be the way you've used the CSS, I would suggest having a reset CSS that runs before you main stylesheet.
http://meyerweb.com/eric/tools/css/reset/
It helps reduce browser inconsistencies, hope this helps.

Related

Strange LSEP Symbol Showing Up Randomly

The U+2028 LSEP character keeps showing up around my wordpress site. Through the inspector, I can see that it is a locally rendered font such as Helvetica or Times New Roman (from what I've seen). It does not show up on all browsers however, I've seen some browsers not display this character.
I've found this Why is this symbol showing up on Chrome and not Firefox or Edge? however it hasn't really helped in removing the character from my site.
Is there a way to remove or disable the rendering of this character? While they dont show up on some computers, they still leave a blank space similar to a tag, and it screws with the structure of the site.

Bad UTF character in DOCTYPE breaks page in IE

We have a search results page that worked fine but now, when viewed in IE9 it's forced into compatibility mode and breaks the layout (we don't support IE <9).
Some poking around seems to point to the opening < of the doctype being converted to an invalid unicode character, which is causing the IE grief. Why is this and what to do about it? I am at my wit's end here.
The rest of the site is fine, and this problem is only in IE. Firefox, Chrome, Safari all ok.
http://www.finecooking.com/search?cx=009096020989677304441%3Akkzh0x3f3yc&cof=FORID%3A9&ie=UTF-8&q=chicken
(you can also just search for anything)
It turned out one of the team members saved one of the includes for this page as UTF-8 WITH BOM, the BOM is that rogue character that broke the page. Resaving the file with no BOM fixed everything.
I can't tell you how many includes we had to check.

Text is not displaying properly, how do I fix it?

For the last couple of days my browser Chrome and then Firefox after I downloaded it (importing things from Chrome may have cause the problem there) have been displaying text improperly. I get ? in diamonds in place of some characters (symbols in other languages sometimes, commas and other symbols other times.) Also some text in CSS pages gets replaced E, these Es also show up on in links. Those links seem to display as HTML codes rather than links.
http://i224.photobucket.com/albums/dd150/ErikoKatsuragi/problem1_zpsca93c38a.jpg
http://i224.photobucket.com/albums/dd150/ErikoKatsuragi/problem2_zps67fe9865.jpg
I would later check internet explorer to find that these problems aren't there. My Browsers are displaying in Unicode. Is there anyway I can fix this myself or should I find a professional?
Uninstall and then again Re-install your browsers!!

Rectangles instead of whitespace in Chrome

A website I'm working on is using a custom embedded font that newer versions of Chrome on Windows don't seem to like. Instead of whitespace, weird white rectangles show up. Removing the custom typeface fixes the problem but that's hardly an acceptable solution.
Screenshot:
Does anyone know how Chrome interprets whitespace so that I can fix the typeface?
Turns out the typeface didn't define the Unicode whitespace character (0020). All the other browsers substituted the missing character for whitespace, except Chrome. Fixed by editing the font and adding the character.
Changing the CSS propety letter-spacing to something other that the default value (normal) may produce this behaviour.

Internet Explorer CSS Problem

This page is being rendered incorrectly by IE 9 (and probably older versions too). The right menu is floating to the bottom of the page. Firefox, Chrome and Safari are rendering it correctly. Other pages in the blog are also being rendered fine by all browsers. I already tried to fire IE 9 Developer Tools (F12) and reduce the width of some divs (such as #main and .columns-inner)... no lucky with this approach, even with extra space the right menu is still rendered at the bottom. So I figure that the problem is in the Blogger auto-generated tags / css for the page content (which I am able to modify). Any CSS gurus out there can point what is wrong?
Cheers,
You have this line in your <head>, which is causing IE9 to render the page in IE7 mode:
<META content=IE=EmulateIE7 http-equiv=X-UA-Compatible>
If you remove this, it renders fine in IE8 and IE9. It still renders poorly in IE7, though.
Edit:
In response to your comment, I am able to replicate the issue with the background no longer being opaque. After some investigation, there is a particular script file being loaded:
http://www.blogger.com/static/v1/jsbin/938506610-ieretrofit.js
If you remove the <meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/> on line 4 of the source, and you remove the ieretrofit.js file from line 1471 of the source, the page should render correctly in IE9.
Since the ieretrofit.js file appears to be generated by Google, you might want to ask them about it. If you would like to disable it JUST for IE9, and allow it to continue for IE8 and below, you should take a closer look at line 1471 of the source. Here is a snippet (it's quite long, this starts around character #2275):
'\74!--[if IE]\76\74script
The !--[if IE] there is part of an IE conditional comment. You can change that snippet like so, and it will still target IE8 and below, without affecting IE9:
'\74!--[if lte IE 8]\76\74script
Let me know if you have any further issues!
The page has 104 validation errors — I’d start by fixing those if I were you.
Almost certainly it is because the page is invalid. Also, I really would think about starting again with this page as it is overly complex markup.
Guys. Figured it out (with great help from andyb and Paul D.)
The validator pointed to some unpaired </div> tags that I removed. Now it is working flawless.