Bootstrap Dropdown menu not Fit to Container Class - twitter-bootstrap-3

hi i created bootstrap navbar for my wordpress theme my navbar fit to the window
but i used container and row class to set the texts within the container width but when i click on Collection Dropdown text the dropdown menu appear fit to the window why? i want the dropdown menu fit to the container menu or fit to the yellow div.
HOW I CAN DO THIS?
for show my navbar see this link
http://jsfiddle.net/rerraw/bs2wke9r/4/

After some attempt for solving my problem only i added new grid class to my code and i solved my problem
i added <div class='col-sm-12'>codes here</div>
after this the dropdwon menu fit to the container

Related

How can I hide a modal element in Dittofi?

How do I use a "modal" element in #Dittofi. When I add the element it covers the entire page and I cannot access elements underneed.
When you add the modal box, you need to select the box marked "Modal" in the breadcrumb trial at the bottom of the page.
Then you can select the modal settings box to either show or hide the modal box.
Let me know if that works for you?

QT designer layout inside layout

I am not able to design below layout in qt -designer
So under main window , we have one horizontal Layout that have two vertical Layout and each vertical Layout have.
one horizontal Layout that contains combo box and push button
And another Listview widget
Since you didn't include any information about what steps you followed in trying to create this layout and what the final result was, it's impossible to tell where things go wrong. However, to create the layout as described in the post, you could do the following.
Step 1: Add widgets to form
In a new form in Qt Designer, roughly place the widgets where you want them to be in the final layout.
Step 2: Add widgets to layouts
Add widgets to layouts starting with the deepest nested widgets. In this case that would be the comboboxes and push buttons. To add a push-button and combobox to a layout, select both push-button and combobox, either in the layout itself or in the object inspector, right-click on the selection and select lay out > lay out horizontally in the context menu.
Repeat these steps for the other widgets and layouts. When adding the horizontal layout and the list view to a vertical layout, make sure you select the layout and not one of the widgets in the layout:
Step 3: Set layout of main window
To set the layout of the main window, right-click either anywhere in the main area of the form outside of any child widget or on the MainWindow node in the object inspector and select layout > lay out horizontally. This should result in something like this
And the object tree in the object inspector will look something like this

VueTool Tip does not work in modal

I'm trying to use Vue ToolTip in my project. I can successfully get it to work on my page, however, it doesn't work on my modal pop up page.
I've created a fiddle here: https://jsfiddle.net/bkw28n9h/
In this fiddle there is a Tooltip text on the page which shows up tooltip on hover. However, there is also a tool tip on the modal popup can comes up when clicking on any list item. The tooltip on the modal pop up does not show up on hover. Why is that?
I add the tooltip directive like this:
Vue.use(vueDirectiveTooltip);
Do I need to specifically add it to the modal component? If so, how do I do that?
Add to your style this:
.h-tooltip {
z-index: 99999!important;
}
The tooltip is being covered by your modal.

Fixed nav under a relative div

I have a relative div above a fixed one which acts like a navigation bar.
I want to be able to scroll past the relative div before the fixed div starts having to scroll here is my website.
as you can see from just scrolling on the site the sidebar doesn't work as intended.
Try using JavaScript to detect the scroll position of the window and then change the CSS to start scrolling like a fixed div.
Another tip, the the fixed div which contains your projects on the home page lays over your footer when you scroll to the bottom.
Use JavaScript to detect if the user is at the bottom of the page or not and then set the CSS of it to have a margin from the bottom of the page.
Hope I helped.

Preventing list items from appearing until YUI3 Tabview loaded

I'm using YUI 3 tabview, and my page appears without tabs very briefly, and then the tabs appear. I found this page:
http://yuilibrary.com/yui/docs/widget/
Hiding Progressively Enhanced Markup
which seems relevant, but I'm not sure how it applies to tabview.
Is there a way to prevent the display of the untabbed list until the tabs are ready?
Thanks very much!
The default style of the tab container could be set to display:none; and on your tab view creation you could then remove the display:none property
You could bind to your tabview render event and set the display on that.