1

I am using the Bootstrap CSS framework. I'm noticing the oddest thing.

When I use IE8 to view the site I made (http://www.foddersystems.com/fodder-feed/alfalfa.html) the local version and the server version look different. At first I thought my CSS file or HTML code had some difference. However, I downloaded all the server files and looked at them locally and it isn't the code. Has anyone run into this? I am aware that IE doesn't like certain JS to run locally, so is this what I am running up against?

screenshot

See the screenshot for differences:

  1. the top right nav bar menu, one version has flat solid colors
  2. The breadcrumb links are messed up
  3. there is an extra break after the slider.

Again, the local and remote code are exactly the same. I understand IE8 CSS support isn't so great. But it should look the same, right? I can live with everything except the breadcrumb issue. I really need to fix it. I have tweaked the original breadcrumb IE based on the tip on an inline block bug and also on another StackOverflow question.

Gray
  • 7,050
  • 2
  • 29
  • 52
Carlitto
  • 31
  • 1
  • Try adding the meta tag explained there : http://stackoverflow.com/a/10393940/1478467 – Sherbrow Feb 28 '13 at 06:20
  • Just go to and write the html/css code of that part there, so that people can probably find the problem and correct it. – John Feb 27 '13 at 20:44

1 Answers1

0

The background color of btn-sucess is set to 

.btn-success{background-color:#6C7E54;} This is wat appears in IE8

You can set it to :

.btn-success{background-color:#5BB75B;} this will make it look same in all browser,as in ff it appears greenish .

The breadcrumb looks fine to me on ie8 cant tell how it looks locally as ur screenshots are not viewable .

the Space issue between the carousel and tabs is due to small margin set by you and break tag cant make up for wat you are trying to accomplish 

.carousel {
margin-bottom: 5px;/*set to higher in order to get more spacing between tabs and carousel*/
position: relative;
}
Shail
  • 3,639
  • 1
  • 18
  • 29
  • For the breadcrumb, there should be three links in it. You will notice that on the bad screenshot, the 3rd link is overlapped over the 2nd link. ie whenyou dig into the site to three levels down, the third level link in the breadcrumb always overlaps the 2nd level link. – Carlitto Feb 28 '13 at 12:16
  • your comment made me switch it from Comp mode on and off and that is what the issues are. To fix the breadcrumb issue, I switched it from: – Carlitto Feb 28 '13 at 14:33
  • Your comment made me flip between comp mode on and off. That was it! To fix the breadcrumb, I changed it's CSS from display: inline-block; to display: inline; Not perfect but displays the 3rd link right now. I guess I will have to live with the other oddities. – Carlitto Feb 28 '13 at 14:34
  • @carlitto wat other odities ..didnt wat I suggested help them resolve – Shail Feb 28 '13 at 14:50