html - border radius rounded corners into parent and child <div> -


i have problem hover on div, has border-radius.

when hover div there small line color not similar hover color.

html code:

<div class="grid_veiw_case_active">     <div> text</div>      <div class="delete_div">         <div class="delete"><p class="button_text"></p></div>     </div>  </div> 

css(part) code:

.grid_veiw_case_active {    border-style: solid;    border-width: 1px;    border-color: #404040;    border-radius: 5px;    background: #7d7d7d;      width: 254px; } .grid_veiw_case_active .delete {    border-top: 1px solid #969696;    width: 100%;    height: 38px;    -webkit-border-bottom-right-radius: 4px;    -webkit-border-bottom-left-radius: 4px;    -moz-border-radius-bottomright: 4px;    -moz-border-radius-bottomleft: 4px;    border-bottom-right-radius: 4px;    border-bottom-left-radius: 4px;    background: #c1c0c0;  }  .grid_veiw_case_active .delete:hover {    background: #d06d70;  } 

code link http://jsfiddle.net/xbj3b/.
image illustrats problem
enter image description here

add border-radius: 0px; hover state.


Comments

Popular posts from this blog

java - activate/deactivate sonar maven plugin by profile? -

python - TypeError: can only concatenate tuple (not "float") to tuple -

java - What is the difference between String. and String.this. ? -