http://mapleleafmarkets.com/ is the website. I was assigned this from another dev who couldnt figure it out... it has me scratching my head too.
i have tested this on ie chrome and safari but mozilla seems to not play with absolute positioning the same way the others do. Any one have a clue?
thanks!
was able to fix this using a nice mozilla CSS hack
#-moz-document url-prefix() {
.navbar {
margin-left: -550px !important;
}
}
Related
I just implemented Google recaptcha on a site and it appears to be having a weird graphic glitch under the box itself.
You can see a picture here:
As you can see, under the captcha there's some glichy looking lines. Does anyone know a way to get rid of this and or if it's supposed to be there? (I don't think so, but the implementation code is taken directly from google themselves).
I had the same problem and figured out that the line height of 20px that I set for the body tag in my CSS file was the culprit. Try this, it worked for me:
.recaptchatable * {
line-height: 4px;
}
For me, I had to choose a THEME in the implementation of the recaptcha instance on a form building widget for wordpress. It was not indicating ANY theme when it was displaying weird. I seleceted "clean" and it works nice.
Example
How can I get rid of the little box/arrow next to images in my web browser? What controls when they show up and when they don't? I'm porting a blog from WordPress over to BlogEngine.NET. Those little arrows aren't in the WordPress blog, but they're showing up in the posts in BlogEngine.NET. I'm viewing both in Chrome. They also show up in IE and Firefox, but not in Safari.
UPDATE:
Here are some live links (I'm viewing in Chrome):
WordPress (no arrow): http://www.inrixtraffic.com/blog/2012/neverlate-inrix-traffic-contest/
BlogEngine.NET (arrow): http://www.inrix.com/traffic/blog/post/2012/06/18/NeverLate-INRIX-Traffic-Contest
That is coming from the CSS, specifically this selector:
div.post .text a[href^="http:"] {
background: url(../../pics/remote.gif) right top no-repeat;
padding-right: 10px;
white-space: nowrap;
}
According to my inspector (built into Chrome, right click, inspect element), that is coming from http://www.inrix.com/traffic/blog/themes/Inrix/style.css, line 372. Ditch the "background" line from that file, or override it in a later css file, and you will be golden.
I have absolutely no succes in getting IE 10 to display custom fonts. Has anyone else a solution for this? I can see a few shout-outs on the net that others have trouble with their fonts in IE 10, but no solutions or confirmed bugs to be found.
Anyone with the same experience or solution?
This is what I have right now, and it works well in IE before 10, Chrome and Safari:
#font-face {
font-family: "LCD";
src: url('http://www.somedomain.xxx/Public/Fonts/Quartz_Regular.ttf');
}
<!--[if IE]>
<style type="text/css">
#font-face {
font-family: "LCD";
src: url('http://www.somedomain.xxx/Public/Fonts/Quartz_Regular.eot');
}
</style>
<![endif]-->
I have tried to substitute with font files in other formats woff, ott etc. but no luck at all with that.
The answer which hinted at font-squirrel made it Work.
Now the working markup (for IE 10) is:
#font-face {
font-family: "LCD";
src: url('/Public/Fonts/quartz_regular-webfont.eot');
src: url('/Public/Fonts/quartz_regular-webfont.eot?#iefix') format('embedded-opentype'),
url('/Public/Fonts/quartz_regular-webfont.woff') format('woff'),
url('/Public/Fonts/quartz_regular-webfont.ttf') format('truetype'),
url('/Public/Fonts/quartz_regular-webfont.svg#quartzregular') format('svg');
font-weight: normal;
font-style: normal;
}
I assume this is in an HTML file, due to the HTML comments and style elements...if not, look into that.
Beyond that, just use the #font-face generator
Is it possible that IE10 does not render web fonts if Security Mode is activated? After deactivating (internet options - security) my websites were displayed correctly ...
I had the font-squirrel #font-face working in everything but IE, myproblem though was that the .woff was the only thing not included in IIS mime-types on my server. That might help someone who's also ended up on this question.
I just came across a client reporting he was unable to see the webfont on his website. Ends up that the "High" security level (in IE options) blocks web fonts by default. You can create a custom security level that is basically "High" but still enables web-fonts. Or just turn it down to medium-high.
The font-face not updated on IE 10 -> reference , you can use it same IE-9
you can learn how use font-face here
i think you include all type of your font...
I used this here:
http://www.impressivewebs.com/ie10-css-hacks/
More specifically:
#media screen and (min-width:0\0) {
/* IE9 and IE10 rule sets go here */
}
By using this we can just pop in a nice alternative font and still have sexyness in the other browsers with open fonts.
Try the fonts here:
http://cssfontstack.com
Must add that the fontface generator doesn't fix this for all fonts. When using the font Helvetica Neue Medium Condensed (HelveticaNeueLTW1G-MdCn) for instance. I'm using multiple fonts on a website. They all work with the fontface generator, except that Helvetica-font.
I am applying border-radius on my layout and I having problems with IE 7 and IE8. I'm using the PIE.htc but I still can not do the compatibility works.
The code is:
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border-top: 0;
-moz-border-top-left-radius: 4px;
-webkit-border-top-left-radius: 4px;
behavior: url(PIE.htc);
I'm testing in ieTester, can anyone help me?
if you use behavior: url(PIE.htc); then your Pie.htc should be in the same folder as your html page or master page.
your page's doctype should be XHTML or HTML5.
then my experience says its better to place the behavior code on top your css rule.
you better not use IE Tester as a trustful utility. It came up with a hand full of tools but not quite useful ones. its better to use IE 9, then change its browser and document mode in its developer tools. when you change them the whole page will reload in that mode. it even has quirk mode which is a complete total NIGHTMARE.
And if you can update your question with more facts about your code and browser.
After testing I have found Disqus makes IE8 go into Compatibility Mode "Hard Assert". When I remove it it stops the behavior and stays in Standard Mode. Due to the fact that IE8 is tide to Windows XP IE8 will be around awhile. Worth fixing. Anybody know a fix for this? I already contacted Disqus support. I am not hopeful of a quick response.
If you dont want to use CC's to target IE8 Disqus just say...
#disqus_thread {
display:none; /* IE8 */
}
:root #disqus_thread {
display:block;
}
That is not the case. Remove the css remove the issue.