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 :

enter image description here

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

Popular posts from this blog

cakephp - simple blog with croogo -

How to group boxplot outliers in gnuplot -

bash - Performing variable substitution in a string -