I am creating a Wordpress theme with Bootstrap 3.
I add html5shiv.js and respond.min.js in head and, now, the theme works in IE8.
When I open the website, for a second and only in IE8, the layout isn't correct and then is perfect.
What is the best practice to fix this initial visualisation problem?
Stop using Ie8, it is dead ....
I solve with a css "respond-fix.css" inside conditional comment with this css code:
body{visibility:hidden} #media screen and (min-width:1px){body{visibility:visible}}
Related
I'm using the Wordpress theme Phoenix for my portfolio but i'm having an issue with the portfolio section. Each project is open in an overlay and i can't seem to find the reason why there is no link on the cross made to close it.
https://maurugeonyannick.com/Portfolio_V2/
You are using z-indexes and that's messing up some of your layering.
I would place a z-index of 10 to your .overlaytop class. That will fix your issue.
As it currently stands, your .overlaytop element is buried underneath your .container element having a z-index of 2, then within your .container you have your main heading with a z-index of 3, etc.
Using chrome's dev tools, adding the z-index of 10 to
<div class="col-md-12 overlaytop" />
addressed the issue.
Thank you!
I had a negative margin on the overlaytop class aswell. I knew it was something like this but i couldn't find the issue :)
.overlay .overlaytop {/*margin-bottom:-30px*/ z-index:10;}
Solved my issue.
You're the best!
Been combing the code and searching google/stack/forums for a while, but no luck. I've got a layout built with bootstrap 3 that uses should be 4 columns at lg, 3 at md, 2 at sm and 1 at sm. It works on all browsers except ie8. On ie8, only one column is shown as the col-xs-12 is overriding everything. I have implemented the require.js script, the IE=Edge meta tag, and think I have the scripts loading in the correct order. Below is the html/css/js. Anyone catch anything that I didn't?
https://gist.github.com/anonymous/6978014
There was a bug in the require.js script somewhere. Pulled down the latest minified version and it suddenly worked. :P
I am just getting started with dreamweaver and i get this weird problem(i use codeigniter framework) :
I put this code in one of my CSS selector (the url is auto-generated by dreamweaver's browse feature) :
background-image: url(../images/main.jpg);
This image is shown perfectly in the design view(dreamweaver) BUT its NOT shown in the real browser (i use the latest Google Chrome).
I have tried to manually browse the image with this code :
background-image: url(http://localhost/ci_latihan_dreamweaver/images/main.jpg);
But the result is same.
What should i do?Thanks :D
Try this one it will work
background-image: url(../../images/main.jpg);
We simply have to press f12 in Dreamweaver(run site from Dreamweaver). The Dreamweaver will generate a link that dont use the localhost, and the images and css works perfectly :D
ive been finally polishing off a website i was building but to my dismay i recently checked the website in Internet Explorer and found the images weren't loading fully.. you can see can the borders for the image but nothing loads in between. i thought it might something i altered on wordpress, but the main page has images from from non wordpress html files and they don't load either.. everything works fine on every other browser except Internet Explorer.. any ideas why? probably a simple fix
here's the website.. . all the code and css is viewable there, if you want my wordpress code let me know
maybe the code just needs to rearranged to make window browsers happy?
any help would be great
Looking at the source for the shop.html, it looks like you are specifying the height of the images, but not the width. Opera, and Firefox are ignoring the width="" and using the default width, but IE is setting it to width="1." I don't know how to change this in Wordpress but if you remove the width="" or add a value it will show correct.
You can see this if you r-click the image line in IE and select properties: it shows as 1X290px.
img src="images/shop/julianduron.jpg" width="" height="290"
hope this helps
I just completed a site: http://www.justcelebrations.co.in . I haven't launched it yet because of certain problems. The site uses css3 text gradients to style text in span and border radius to style most divs. It has to be made dynamic later so I don't want to change the text effects to images or something. The problem I am facing is that the site hangs IE8. I haven't tested it in lower versions of IE. I have tested the markup thoroughly and its validated and the css too is valid except for features which are from css3 like opacity, border-radius etc. I have also added google script to make ie behave properly and mordenizer library. The site still hangs IE8. Please Help me out here..
EDIT: after a lot of testing and debugging, found out that ie<9 were crashing because of some text elements being styled by p:first-letter or h1:first-letter (which, as is the case with ie, is totally random as :first-letter is supported by IE7+ ). So all i did was separated those styles from base.css to a non-ie.css and loaded that file with a [if ! lt IE 9]
and it worked!
after a lot of testing and debugging, found out that ie<9 were crashing because of some text elements being styled by p:first-letter or h1:first-letter (which, as is the case with ie, is totally random as :first-letter is supported by IE7+ ). So all i did was separated those styles from base.css to a non-ie.css and loaded that file with a [if ! lt IE 9] and it worked!
Can you add <!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]--> to target fixes. As you make changes view in IE8 through IE9(F12) and play with -ie-(compared to -moz- & -o-) in your css. I would also keep a CSS 2.1 file and a CSS3 file to keep track of your new code.
It's working good here in Safari. Just to narrow this down, what if you remove all the conditional and IE specific libraries you got from Google? In my experience, all the various JS libraries that are supposed to make older IE versions behave always seem to break or conflict with some other script or library like jQuery.
Also see the answer in this thread for optimizing your page loading by placing the JavaScripts at the end of the <body> section. Perhaps in your case, loading the JS last will make some kind of difference to Explorer.