IE7 (ugg), and Layout Issue [closed] - css

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
Using Bootstrap 3, Respond.js for anything under IE9
Why is my page doing this in IE7?
http://www.ctautobodyshops.com/
Screenshot:
Let me know what else you need...

Bootstrap 3 does not support IE 7, it supports IE 8 with Respond.js. However IE8 has support for certain CSS properties that IE7 does not handle. The main one that works with the entire Bootstrap system is
box-sizing: border-box
There's an IE7 css and a polyfill for Bootstrap here: https://github.com/coliff/bootstrap-ie7
But even with those things, if you use in your own custom css styles that are not supported by IE7 then they will not show up styled as on modern browsers.
There's other classes like inline-block that don't work with IE 7 either, so in your own CSS you need to use fallbacks.

<section class="row"> has height:100% which doesn't work nicely with IE7. You have to give width in IE7.
If you remove the height: 100% it helps and then add width atleast in percentage to each required element

Related

Ruby on Rails CSS support [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
I am working on a personal project using Ruby on Rails v.6.0.2.2. I was coding a CSS Responsive menu this morning I had all sorts of problems. The mobile menu button was not working. It is a HTML/CSS only menu I have used in the past, which works fine Responsive, Pure CSS Off-Canvas Hamburger Menu.
What I have determined is that Rails/ERB does not seem to support the :target pseudo class. Is there documentation somewhere which specifies the supported CSS classes?
In principle, CSS support has nothing to do with Rails. CSS is purely negotiated between your css/html code and the web client. But some Rails components can get between the two, for better of worse.
In this case Turbolinks is probably preventing your :target pseudo-class from working. Try adding data-turbolinks="false" to your links:
<a data-turbolinks="false" href="#p1">Jump to the first paragraph!</a>
Or if you are using a link_to helper:
link_to "Jump there", your_url(anchor: 'p1'), data: { turbolinks: false }

What is the best way to make sure this css works in all browsers? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Closed 8 years ago.
Improve this question
I am taking over an application that has buttons with this css:
background-image: -moz-linear-gradient(center top , #049CDB, #0064CD);
it looks beautiful in firefox but looks like a mess in IE, etc
what is the best way to take these clearly firefox specific css and determine the best way to make it look the same on all browsers (just need IE8+)
This tool might be a useful tool for you.
Since this CSS attribute is still a working draft of CSS and has some legacy it will require a lot of markup to be fully supported for your current situation. The -moz- prefix is one such isntance of providing support. All other browsers will required either the standard, -ms-, -webkit-, -webkit-type or -o- prefix as well.
You should look out for other spots in the application you've taken over for code that hasn't been fully tested on other browsers.
LINK
http://www.colorzilla.com/gradient-editor/
This is a matter of opinion but there are tools online that will help you generate css for gradients that works across browsers. http://www.colorzilla.com/gradient-editor/ is an example.

How to create css based breadcrumb which supports IE8 [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 9 years ago.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Improve this question
Can some one provide me some good css example to create breadcrumbs for my asp.net application. Which should support IE 8.
I was trying this link http://www.red-team-design.com/css3-breadcrumbs but it is working in Crome not in IE8. Please someone help me.
Thanks
Gulrej
The code you're trying to use contains several features that are not supported by IE8.
border-radius
If you need rounded corners, this can be made to work using CSS3Pie
box-shadow
Also use CSS3Pie for this.
text-shadow
There is no good way to get this working in IE8. Sorry.
linear-gradient
Also use CSS3Pie for this.
rgba() colours
And again, CSS3Pie for this too, although there are some quirks to watch out for.
::before and ::after
Actually, :before and :after are supported in IE8, but need a single colon, not a double colon.
As you can see from my comments above, most of these features can be made to work with a bit of effort and a few hacks, but by default they are not supported by the browser.
In addition, some other browsers may need vendor prefixes for some of these features. In particular, the gradient styles should be provided with prefixes if you want to support all common browsers.
Your options:
Write your CSS in a way that allow sensible fall-backs -- eg a sensible plain colour background for IE8 that is overridden by the gradient for browsers that support it.
Use a library like CSS3Pie, which attempts to make IE8 more compatible with modern standards. But be aware that if you use it a lot, it has been known to slow IE8 down quite badly.

css not working in IE9 or earlier versions [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
I am building a site which runs in Firefox, Chrome, Opera and IE10 perfectly but in IE9 css are not working properly for textbox and round borders.
here is my site link
http://meetmentors.in/sohil/
for testing check this page also
http://meetmentors.in/sohil/registration.php
how can I make this to compatible with IE9 or earlier versions.
Well there is an option where you can make the place-holder property work in earlier versions of IE.
You will have to include this JSlibrary.
http://jamesallardice.github.io/Placeholders.js/assets/js/Placeholders.min.js
Try this DEMO in IE9 and below. It should work.
HTML
<input type="text" placeholder="This text will dissappear once you type"/>
Regarding your second query about the rounded div's check this link

Joomla CSS not rendering on IE or Firefox [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 8 years ago.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Improve this question
Just had a frustrating couple of hours and I figured I'd haul out the big guns and ask the intertubes.
I have a Joomla site with a 3rd party template that doesn't seem to be rendering CSS in IE8, IE9 or Firefox, however Opera, Chrome and Safari are all reading it like a boss.
Site is: http://www.quizzically.co.uk
Theme is: http://joomlathemes.co/free-orange-template-for-joomla-2.5/
The internet is abuzz with questions from upwards of four years ago with this issue, but I'm not finding anything recent. The old issues are all very personal to the sites that they happened on as well so no love on the answers I did find.
My gut feeling is that something that directs to the CSS is not being picked up or is being ignored by Firefox and IE. I don't know what this is or how to begin looking so any help that can be offered would be ecstatically accepted.
Thanks.
Line 39 of styles.css has an incorrectly coded background style:
#header-w {position:relative; background:"fff }
The " should be a # for the color.
IE and Firefox are using stricter standards than the others, so break once there's an error.
Once that's corrected, the rest of the styles will load.

Resources