Any one know how to get the tabs from Bourbon Refills to work in IE8?
I keep getting the tabs stacked on top of each other vs side by side.
I've added Selectivizr thinking it would correct the situation, but only fixes the grid from Neat.
Figured it out. Just removed the media queries inside the SASS for the tab layout and all is well.
Related
Firebug used to to display styles in the Computed panel like this, with computed styles grouped:
But for some reason it now displays computed styles like this:
The only grouping available is "Other" which appears to contain every CSS style. How do I make CSS styles group together?
I am using Firefox 46 with Firebug 2.0.16. The change began seemingly out of nowhere, I did not adjust any settings.
I have tried toggling every option in the dropdown menu. The value of the computedStylesDisplay setting is grouped (default value). I tried switching to alphabetical and then back to grouped but it changed nothing.
This is obviously a bug in Firebug in combination with Firefox 46.0. In Firefox 45.0.x it was still working fine.
I've filed a bug for that in Firebug's issue tracker and already fixed it. I have also created a build with that fix. Now it's up to the Firebug team to make a proper new release.
Note that the Firebug team is already working on Firebug 3, which integrates into the Firefox DevTools. Those tools don't have the grouping yet, but it's already requested in bug 977128.
Update:
Firebug 2.0.17 got released, which includes the aforementioned fix.
Update:
Firebug is officially discontinued, i.e. its maintenance has stopped in favor of pushing the development of the Firefox DevTools.
I've run into the same issue. It doesn't exactly solve the problem but what I've found helps at least a little is to click Options -> Show Quick Info Box. Gives a list of current applied styles to the element you're hovered over in the HTML console but unfortunately doesn't provide the original CSS reference line.
jquery-bootgrid is a great little tool, i have it working perfectly well functionally, but i have an issue with the styling of the control.
For some reason the search bar generated by the js library spans across the entirepage, forcing the control for selecting the number of results shown, down to a new line.
I've also noticed that the paging control isn't styled correctly and nor is the dropdown for removing columns.
I've got the latest css and js files, is anybody else having the same issue?
I have the latest bootstrap available, could this be an issue?
My bad, I didn't include the jquery.bootgrid.css in my bundling at the right spot.
I am building a site in Joomla (unfortunately) for a client. I have installed a template that uses Bootstrap as its basis, with some integration with Joomla, called H5BPTB. The problem I'm having is that when I visit the homepage on a small screen, and toggle the responsive navbar, it works fine, however after logging in, the navbar will open once, then close, but then no longer responds unless I refresh the page.
I read a few references elsewhere on stackoverflow to this being a problem with missing CSS transitions in the .collapse class in Bootstrap CSS. I checked and they are not missing. I also read another answer that suggested that it was a problem with some other Javascript overriding support.transition in the Bootstrap JS. I also can't find a reference to that in any other JS file. Is there anything else this could be?
Also I should add that the navbar works perfectly well in IE, but not in Firefox or Chrome.
Here is the site: http://avantgardeinternational.eu
I'd recommend just trying to update your Bootstrap files in the theme. They're both on version 2.1.1 and as far as I've seen looking around some people have had similar problems with earlier Bootstrap version.
The files you're looking to change are:
http://avantgardeinternational.eu/templates/h5bptb/css/bootstrap.min.css
http://avantgardeinternational.eu/templates/h5bptb/css/bootstrap-responsive.min.css
http://avantgardeinternational.eu/templates/h5bptb/js/libs/bootstrap/bootstrap.min.js
If that doesn't work, I'd try just looking around and making sure that some scripts aren't conflicting, that could just mean disabling all but the Bootstrap JS. Then seeing if it works fine.
http://twitter.github.com/bootstrap/
Edit: Just attempted this, changing the CSS messed with the styles a bit, and it still didn't work. I don't think it loaded the JS into the page properly though, I'll try that now...
Edit 2: So after giving this a shot, I've concluded there is only one explanation now... I've observed the difference between the page when you're logged in and logged out. When you log in there are various other bits of JS that load into the page.
One of these must be overriding Bootstraps collapse methods, thus stopping it from working. There are a few extra scripts that load when you're logged in and some more styles. It might be working trying to remove these and then trying it again.
I am helping a client with an eCommerce site (runs on ProStores from eBay).
The issue is that the site's base stylesheet is breaking (being disabled) when the page is translated with the Google Translate widget. This only happens in Firefox. Chrome, IE(6-9), Opera and Safari are all fine.
Translate in FF was working prior to some changes we made recently: mostly graphical, some additions to the stylesheet. I had to tip-toe around their templates which were built with tables, outdated code etc. so I am overwhelmed when trying to troubleshoot this.
Here is a link to the site: http://www.myfantasticbags.com
(open in FF and use google translate in the header area to see the issue)
Thanks in advance!
I had the same problem and much frustration with this.
The problem I was having was that it was translating my website's font-resizers - From 'large' to 'grande' etc. which was throwing off the font-resize element and entire site.
Try adding a class="notranslate" to any elements you think may be translating and throwing off your stylesheet.
Hope this helps!
Korey
Add class="skiptranslate" to the head tag.
If you also have a link to a print preview style sheet, so your visitors can see how pages will print, try this: Putting the link to your external stylesheet inside a div with class="notranslate", may not only fix the translation in Firefox but also when flipping back and forth between your print preview and default CSS in all browsers. I know that divs in the head tags are atypical, but I don't see any problem arise from that.
I am experiencing strange issue with scrolling, After doing some ajax operations on a webpage, which dynamically add & remove contents from the page. Mouse scrolling hangs up (mouse scoll events doesn't work) and pressing UP ARROW key from keyboard solves the problem.
I wonder is there any known issue like that for chrome?
Edit:
I don't have any js errors on the page, I am simply adding contents to div block dynamically
<div id="ContentArea">
<!-- load contents here -->
</div
<script>
loadHtml('/my/target/page', 'ContentArea');
// this contents may vary in size
</script>
Edit:
Similar thing happened to me on StackOverflow when i clicked load (n) new answers while answering some question. (some days ago)
I had similar issues and got them fixed by scrolling to the top/left corner before replacing the content. Just add the following line before you replace anything:
window.scrollTo(0, 0);
I've tested it only with Chromium 9.0.594.0 (67311) on Mac, but I think chances are good that this will work with on other platforms as well.
I've had strange problems with Chrome and scrolling, then I uninstalled the SmoothScroll extension and everything worked.
Try disabling all of your extensions and see if the problem persists (note: disabling does not uninstall them but will help you identify if an extension is causing the problem):
Menu button -> Tools -> Extensions
Then click the Disable link on all of them (and you may want to restart Chrome for good measure)