Label Select changed its style when it is MacBook

Navigation
0

Greetings! I have an html tag called <select> with bootstrap class form-control this class adds some styles which are these: 

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.428571429;
    color: #555555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

As we can see it has a border-radius: 0; , my problem is that when I open the page in MacBook the label <select> is displayed as if it had a border-radius . I add an image to see the error.

    
asked by zerokira 11.09.2017 в 17:29
source

2 answers

1

I would recommend you to restore the default settings of the label with this you should not have problems, good luck! 

select {
  -webkit-border-radius: 0px;
  -webkit-appearance: none;
}
    
answered by 13.09.2017 в 07:19
0

Each browser implements the input in one way. The best thing to solve this problem is to remove the appearance as Muriano says and then help you with: before and :: after making the design that you like.

    
answered by 21.09.2017 в 14:27
How to center these elements ng-repeat does not show me the list