javascript - dropdown-menu and drop-down list width is not perfectly align -
i not sure why dropdown-menu, , drop-down list width not align. set both of width be: width:300px;
it looks right :

here have in jsfiddle
since .dropdown inside container #dd, initial x-axis wont same parent, if parent has of css layout enhancement applied effect width, border or padding etc.
to solve this, shall have negate effect of padding or border, applying respective negative starting point on x-axis.
so make following change code.
.wrapper-dropdown-1 .dropdown { position: absolute; top: 100%; left: -1px; /* <--- change */ right: 0; background: white; list-style: none; font-weight: normal; opacity: 0; pointer-events: none; width: 300px; border-right: 1px solid black; border-bottom: 1px solid black; border-left: 1px solid black; }
Comments
Post a Comment