I'm using PrimeNG 1.0.0-rc.4 (although had the same issue with earlier version). The dropdown always displays its dropdown pointer to the right. A rollover shows the associated button is also to the right. Tried it with different themes with same result. What's going on and how do I fix it?
My recommendation would be that you better use the grid system provided by PrimeNG, because you maybe solve that specific issue now, but it's so probable that you'll find more like that on the way. Here's the documentation about it: http://www.primefaces.org/primeng/#/responsive
Related
I am using the latest version of Redactor and have noticed that the z-index of the toolbar is set above many other components (Bootstrap modal, drop-down menus, etc). I browsed the docs and could not find any mention of changing the toolbar's z-index.
What is the best way to fix this problem? Is there a setting I missed that can be called upon initializing?
From Art at Imperavi-
Thank you so much for reporting this. At this time, the only
workaround is to manually adjust Redactor's z-index, please see line
58 in redactor.css.
I am in the process of using Foundation to create a website, and I have come across a problem that I can't seem to find the solution too. I have noticed that when expanded, some of my drop-downs get cut off in the Mobile Version of the Top Bar, and I was wondering if anyone had come across this issue, or had a fix for it. Did I do something in the CSS that made the JS no longer count all of the elements correctly?
You can see what I am saying here.
http://www2.100foldstudio.org
Just try this by adding in css.
.jScrollPaneDrag {
height:0px!important;
}
I think the link is break in theme
Update the link from
http://www2.100foldstudio.org/wp-content/themes/100foldstudio/_/js/functions.js
to
http://www2.100foldstudio.org/wp-content/themes/100foldstudio/js/functions.js
Figured out that if I add a List Item at the end of the main top bar section in "mobile" mode, and added a clearfix class to it, the js kicked in and started calculating the height correctly.
Thanks guys,
I can see this in Chrome at http://twitter.github.com/bootstrap/javascript.html#dropdowns. Basically, if you click on dropdown link twice (to open and then close the submenu), there's a yellowish border around the menu item which looks strange. I can't find in CSS where it is set, so the question is how can I remove it?
It's an outline that your browser inserts by default.
Try to insert in your css
a.dropdown-toggle { outline: none}
Are you sure that this is not a setting in your browser?
I can not replicate this issue at my end.
Try changing your browser and check if problem persists.
It seems like a browser issue.
It could be caused by poor display or problem with your VGA output. I'm not experiencing any of symptoms you mentioned, but, based on my experience, could be caused by one of those two. You might want to consider re-installing or updating VGA driver, or playing around with settings such as gamma, brightness, or so.
Hope it helps.
I'm getting a wierd bug in Safari 5.0.5 for windows. When I apply my styles the down arrow in the select box button disappears. I tried removing classes and it seems multiple classes trigger the bug. Any help would be much appreciated. You can see an example at http://jsfiddle.net/fbsRY/2/
You cannot reliably style select elements using CSS as browsers try to stick to the operating systems defaults. If you MUST style these elements, you'll probably have to find a JS based alternative.
Not a full solution, but I did find more details about the problem at http://www.codingforums.com/showthread.php?t=179464. It seems that it might be a bug related to the Windows Classic Theme. I'm kind of a geek that way. Love my flat gray interface :)
I have a label with a tooltip attribute for rollover effect. This works all great. However, it seems to get hidden behind any dropdown lists that are nearby. I have tried adjusting the z-index, without any luck. This issue does not appear in firefox, and I have not tested it in later versions of IE.
I realize this is probably due to IE6s poor css standards-compatibility, but how can I get around this?
Not the best because it requires javascript/jQuery library, but there's a workaround:
http://dhtmlgrounds.wordpress.com/2008/12/23/ie6-select-box-z-index-bug/
IE6 has a know error that selects always end up the highest in the z order...
Custom select control optional?
Have a look at this
Another idea is to use the ajaxtoolkit autocomplete?
The select dropdown in IE6 is implemented as a Windows control, so the browser isn't really drawing it. Thus, it doesn't support features like z-index. One possible solution is to hide all select boxes on the page when you show your tool-tip. Another option is a custom dropdown, which you can find in libraries like Ext.
As astander and MikeWyatt said, selects in IE are topmost. There are two paths to work-around this problem:
Use a custom select box, rendered with divs, etc. This is rather cumbersome, since you won't be able to replicate all of the drop-down functionality.
Place an <IFRAME> under the tooltip (tooltip z-index > iframe z-index). This will work-around the problem, yet you have to worry about the positioning of the iframe overlay.