I am running Thesis 1.8.5 on Wordpress and here is my site www.texashomeloanpro.com . Because I am kind of new to this whole web-design thing, it just occurred to me to check my site in both Internet Explorer and Safari browsers. Unfortunately, my site looks horrible in both of these. More specifically, my homepage fonts are showing up too large, my homepage sidebars aren't positions correctly, and some of my rounded edges aren't showing up.
I know this is quite a laundry-list of CSS issues but if someone could just give me some general direction I would really appreciate it.
Not sure if you've tried this already, but a CSS reset script usually does the trick for me.
It might break your webpage on the browser you are using, but the goal is to make the webpage look consistent across all browsers.
Related
I have a really strange CSS problem (I at least think it is CSS related) with one of my websites, on the clients iMac the 2nd column of the top menu has a unwanted top margin, and I have no idea what causes this. (you can see the problem in this screenshot)
The websites URL is: http://p538551.webspaceconfig.de/
I have already tested this in all major browsers, including Safari on a MacBook but I can not reconstruct the error, everything looks perfect on all my devices. I also tested it using browserstack - also no problems there.
Does anybody know what might cause this issue, or can at least see the problem as well?
Any help is really appreciated.
I am building a photo portfolio website using wordpress and editing an existing theme. I worked on it in firefox and checked a few times throughout at the styling in IE and it was always fine. But having basically finished I looked at it today and it in IE and it is totally messed up. None of the boxes on the main page are lined up right.
I tried using the code in the header to have IE render it as IE7 and that generally worked but it made some other little problems. I am not sure if the problem is my doctype. I don't really know what it should be, or if I changed something along the way that messed it up.
The site works perfectly in all other browsers that I have tried
Here is the site. http://theshalomimaginative.com/blog/
Thanks.
Youre <h3> tags aren't closed. One of the few instances where IE is actually rendering things correctly ;) Other browsers will allow us to make mistakes like this, but IE is more strict.
Never forget the value of validating your code!
I'm working on adding basic print functionality to a web map application I recently built, and I can't seem to make the printing work properly when using Internet Explorer 8 in standards mode. I was hoping that someone with more CSS experience might be able to help.
I've created a basic example on jsbin that demonstrates what I'm seeing: http://jsbin.com/osepov/16. This example prints properly in most browsers. In Internet Explorer 8 in standards mode, however, the map's tile images run off of the first page and onto a second page when printing. I've tried a bunch of different CSS combinations, and have browsed the web for hours looking for hacks that might solve the problem. I've obviously had no luck thus far.
Being that the print functionality works well in most browsers, I am willing to compromise on a few things, if needed, to get this working in Internet Explorer 8 standards mode:
The map doesn't have to fill the entire page, minus the header. It can have a fixed height.
The header is nice to have, but I'm willing to do without it.
I know it is possible to build a PDF on the server, but I really want to do this with a simple print stylesheet.
Note: Yes, I do have to support IE 8 standards mode. I had a solution that kicked IE8 users to IE7 mode, but this was not acceptable to my client.
UPDATE 2: I was able to resolve the issue by bumping IE8 down to IE7 standards mode. The map is printing correctly now.
UPDATE: Nope, this didn't solve the problem. I'm still seeing the same issue. This seemed to work, but I'm still seeing the problem.
ORIGINAL POST: I think I figured this out. Basically, it seems like the "top" div was causing the entire page to get bumped down and run over to a second page when printing in Internet Explorer 8 standards mode. I'm not sure why this was just happening in IE8 and not in other browsers, but there are all sorts of strange IE-only bugs that I don't understand.
The final fix:
#wrapper {height:100%;left:0px;position:absolute;top:0px;width:100%;}
#top {height:70px;position:relative;width:100%;}
#main {height:785px;overflow:hidden;position:absolute;top:70px;width:100%;}
So positioning the "top" div relatively and assigning a pixel height and "overflow:hidden" to the "main" div seemed to solve the problem.
This isn't a perfect solution, but it meets my current requirements.
Here's the updated solution: http://jsbin.com/osepov/19.
I have several divs on a webpage that use the IE css filter to create a gradient effect for the background.
The page is viewed primarily in IE6 (I have no other choice unfortunatly) and displays fine on my development machine. I have also tried viewing the page using IETester and the page also displays fine in IE 5.5 to IE 8.
However, when viewing the page on the "live" machine, the gradients don't show up at all. The browser on the "live" machine is IE 6 with sp3. I have checked the div's and they all have "hasLayout" so that isn't the problem.
Are there any settings within IE that would stop filters working or could anybody suggest any other reasons why they would not be showing up. I can't work out why they work in one version of IE 6 but not another.
Unfortunatly I can't link to any examples.
Thanks
The filter features of IE are not built into the browser; they are using external libraries (DLLs). This is what the 'progid' part is all about, and also explains why some of them are so clunky.
If those DLLs are not installed on the client machine, then the filter styles won't work. If it works in some IE6 machines but not others, then this is almost certainly the problem you're encountering.
Theoretically it should be possible for you to fix the problem by installing the missing DLLs.
However, the problem for you is that if the client is anal enough not to have upgraded their browser from IE6 yet, then it's pretty certain that they're not going to want to have you fiddling around on their machines installing unknown (to them) libraries. In any case, you would have to do it for every individual machine.
The bottom line is that realistically this is not going to be an option. Your best bet is to give up trying to make IE6 do fancy stuff, and go back to using background images for your gradients. It's not pleasant to write, but there is a reason why everyone used to do it that way when IE6 was the standard browser.
I created a simple page with a series of divs. In all of the modern browsers, it appears fine, but in Internet Explorer 6, it falls apart. I have no idea what is causing it to happen.
You can view the page here: IE 6 Test Page
If you have IE6 installed, I included the Firebug Lite JS file on the page, so just click the firebug icon in the bottom right corner to inspect an element.
Here's a screenshot using Browserlab to view the page in Firefox and IE6: Comparison Screenshot
The 3rd div named 'content'(With the Manager Email field) moves everything to the right forcing the next div to the next line. Also, none of the row div's reach all the way across as they should(see Comparison Screenshot)
I did some research and have found that there is some problems in IE6 using floats which I use here, but I'm not sure how to fix it.
Why does my page not display correctly in Internet Explorer 6? And better yet, how can I fix it? :)
It looks like the third div isn't clearing the float properly. Perhaps give each of the row divs the style clear: both
Do you really need to support IE6? Even Microsoft is fighting it nowadays and the market share is starting to be irrelevant except for China.
There's a difference between "not working in IE6" and "not looking perfect in IE6".
As has already been said, IE6's market share is low and continuing to fall -- it's below 2% in most of the developed world (see http://gs.statcounter.com/ for country-by-country stats).
Given those stats, I would say that if the page is usable in IE6 then your work is done. IE6 users are by now used to web pages looking bad. Many popular sites don't work at all in their browser, so one with a few layout glitches won't phase them at all. They'll still use the site.
If it is actually broken to the point of not being usable then it's a different story; in that case, you'd need to consider how important those few IE6 users are to you vs the time it'll take to do the work, and fix it accordingly, but that doesn't seen to be case here: the page seems to work. It looks a bit naff, but it works.