I have "Box Model Hack" issue. I found out that in all browsers except Google Chrome. So I searched the solutions and saw that I should put -webkit-box-sizing property in CSS and define it as content-box
I installed CSS3 for VS2010 and restart it, then CSS 3.0 showed up in drop down list on style sheet tool bar in VS2010. I saw new properties coming from CSS3 but I cannot find -webkit-box-sizing
Should I need VS2010 SP1? or is there something missing? Besides, if there is another Box Model Hack solution for Chrome, please tell me.
All -webkit properties are specific to browsers running on the Web Kit Browser Engine and are not part of the official CSS3 specification.
You can simply type in the CSS you require either in your stylesheet or your CSS style code block. I dont think VS will include a menu item for it (and many other proprietry CSS properties).
Having said that, I've just found a CSS 3 Intellisense Schema that includes the items you're wanting.
Related
I´m rookie in Joomla. I'd like to do a fine-adjustment in the presentation of a bunch of icons in a toolbar that I've created using logo/image components in the layout editor for a certain theme. These icons are being presented with a too wide spacement between one another, and it seems that the cause is the property flex in the css file nucleus.css (.size-5 element, according to inspections in Firefox).
I'd like to know how to resolve this spacement issue, perhaps changing paramenter's values in this css file, if there is no other way. Thanks for any help.
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 working on an intranet project that is having the majority of its users move up to ie8 soon. A bug was detected where when attempting to create/edit a page, the rich html editor boxes would be squeezed compared to what they look like in any other browser.
I found the offending style, its inline and its:
style="display:inline-block"
Now if it was just "inline" then it would be fine. However, it is not.
I have attempted to override the PrefixStyleSheet attribute in the master page and have a custom style in the main css file, but it is not working at all.
I have heard that a control adapter might be helpful to post process the html but i am unsure on how to use one.
Is there any advice you guys can give me?
From my experience, using JQuery "hacks" in the master page header is the most convenient approach, without messing up the system css or the backend.
Find the element you want to override the style to a custom style, and assign your custom style. Be careful if the override is page layout specific, then might add to the page layout header placeholder instead.
http://api.jquery.com/css/
Hope it helps.
I'm running into an issue with IE8 developer tools where they Style information is not displaying in the pane when I select an element. It is definitely page specific as I can switch to another page and the styles will appear for that page when I select an element.
Strangely, if I add an inline style to an element, the inline element will display in the style pane. The page finds the CSS files just fine since the page is rendering with the styles.
Anyone else encounter such a problem? If it helps, the page I'm developing is a Joomla template. I'm currently doing the process-of-elimination by deleting half the code, then the other half to identify the culprit code but I'd thought I'd throw this out to see if anyone else knows. Thanks everyone.
I saw others mention similar problems in other forums and the common issue has to do with a link tag to an external stylesheet. In my case, it was a Google Fonts Directory link.
<link href='http://fonts.googleapis.com/css?family=Josefin+Sans+Std+Light' rel='stylesheet' type='text/css' />
Removing the link temporarily allowed to style information to display.
I had a similar issue when a stylesheet had an include statement for another stylesheet that did not exist.
Try refreshing the Developer Tools' DOM cache - 4th button in the toolbar, the hotkey's F5. If the element's styles change after the Dev Tools window is opened, the actual DOM and the reported one can differ.
I ran into the same issue and found that developer tools was freaking out on my Typekit JS in the head. There was nothing wrong with it. Developer tools was just being finicky. Imagine that. I commented it out and viola, it worked again.
Another buddy of mine said he had seen developer tools freak out when an HTML tag wasn't closed properly so that might be another thing to look for.