I created a website in Wordpress but I seem to be experiencing cross browser compatibility issues in Internet Explorer, most notably Internet Explorer 7 & 8
http://www.vokins.co.uk/
There is an issue with overlapping on the home page (logo and contact number) and none of the properties appear to display on property search (The page appears blank)
The year dates on the News page appear to be sitting to the right of the image rather than in the grey box
How can I rectify this to ensure consistency across all browsing platforms?
I've tested your website (using the tool BrowseEmAll) in IE7, IE8 and IE9.
It works nice in IE8 and IE9 but in IE7 the overlapping is clearly visible:
I would suggest changing the margin of the element "site-title" to padding.
Related
my site http://action.news loads fine in chrome/firefox .
However, on internet explorer, the right div column loads all stuck together
but not the main page only when you read an article
i converted my site from tables/2000s era to mobile friendly
here is a sample article
http://action.news/westnetnews.php?article=Romanian-born%20Actress%20Makes%20Debut%20on%20Canadian%20Television%20Series
here is what it looks like in IE
You are using a css flexbox layout. There is only partial suport in IE11 for flexbox. See https://caniuse.com/#feat=flexbox for details of feature compatibility.
IE11 was released in 2013. You'll need to decide if compatibility is worth changing from flex to something that works in IE.
I am making a site. I am using Drupal 7 with HTML5 strater kit of Omega theme. I have poped up two regions. Each one contains an image and some text (image on the top and text in the bottom). Now the display for the IE9 and chrome is OK but for firefox is not understandable for my brain. the address is http://cakes.apakistanichristian.co.uk/. the reason i am giving out the web address is because i have no idea what css or html code i should post. Just open it in firefox, IE and chrome you will see the difference.
Thanks in advance.
I have a wordpress ng gallery template: http://bit.ly/LTJ9ee, the lightbox of which behaves oddly in chrome when a video is embedded on the same page. The problems only occur when:
Using chrome (v23). Tested on all other major browsers (windows 7) with no problems.
If the page is too big for the viewport (has scrollbars)
There is an embedded video in the page, and the video has already been started (same problems occur whether html5 or flash)
If you look at the page here: http://bit.ly/123NW1C, what seems to be happening is that under the above conditions only, the lightbox is not moving to fit the viewport as it should. This makes parts of it display twice and parts of it not display at all. Web inspector says the divs are positioned correctly, but 'as seen' they are not.
I'm currently stumped on this. The wmode fix didn't help, nor did anything else I found online. Any ideas on what this is likely to be? A bug in chrome? Or something about the way this lightbox interacts with an embedded video.
I finally finished my website and low and behold, there are some inconsistencies in webkit based browsers.
My site has issues with certain link images on hover... the Southern University logo near the bottom of the art page, the hotmail, myspace and facebook links on the contact page, and only the images in the "Drawings/Paintings" vertical scrollable move when hovered over (yet all other images don't move on hover, including the images in the other vertical scrollables on the art page).
What could be the cause of this? I'm thinking some kind of CSS deal with webkit, but I'm not totally sure.
Thanks in advance,
Aaron Chauvin
Edit: Sorry, forgot to mention I'm testing in Windows Vista Home prem. and Windows 7 Home prem. with the latest builds of Chrome and Safari
Nowhere in the provided CSS directory are you using .SU:hover, are you using javascript for the hover or css?
You can simply add something like:
.SU link:hover { //change image }
I have a site where I am using Litebox to display images. On pages with QuickTime embeds the box appears below the movie. How can I get the box to appear on top? I tried setting wmode=transparent but, while it works in Webkit browsers and IE, it fails in Gecko browsers.
Whenever I lightbox or render anything over a select box, I have to hide the select box via display:none. This prevents the select box from rendering over top of whatever I'm rendering in IE 6 (maybe 7 and 8 too, not sure).
You may have to do the same thing to the quicktime embed in this case.