De PHPhulp kroeg
[CSS] Zwarte border submit Buttion IE
Ik probeer in IE10 een submit button die een zwarte border heeft weg te halen. En dit heeft te maken met de focus. Zodra ik op een tekstveld klik gaat de zwarte border weg om de button weg.
dit is mijn code
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
input{
outline: none;
background-color: #ffffff;
padding-left: 1px;
border-width: 1px;
border-style: solid;
border-color: #c6c6c6;
}
input:focus {
border-color: #4bacc6;
}
input:hover {
color: #4bacc6;
border-color: #4bacc6;
}
outline: none;
background-color: #ffffff;
padding-left: 1px;
border-width: 1px;
border-style: solid;
border-color: #c6c6c6;
}
input:focus {
border-color: #4bacc6;
}
input:hover {
color: #4bacc6;
border-color: #4bacc6;
}
ik had dit sukje gevonden
Code (php)
1
2
3
4
5
6
2
3
4
5
6
input[type=submit],
input[type=reset],
input[type=button]
{
filter:chroma(color=#000000);
}
input[type=reset],
input[type=button]
{
filter:chroma(color=#000000);
}
alleen dat zorgt ervoor dat de hele css van de submit knop weg/verneukt raakt.
Weet iemand hier een antwoord op of moet ik er maar mee leven?
Webbrowsers geven daar graag hun eigen stijl aan.
Het valt meestal niet mee om die op elke browser identiek te maken.
Als je er niet uit raakt ... maak een print-screen van een button, sla het op als 'button.png'
en gebruik dan
<input type="image" src="button.png">
Maar dan als nog, meestal is er wel iets waardoor je style van een browser als nog kunt overrulen.
Maarja ik heb er nu eigenlijk al te veel tijd aan verspilt vanwege zo'n lullige border.
Mocht iemand nog het antwoord weten, we hebben een paar css mensen hier aanwezig, dan hoor ik het graag.
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
input[type=submit],
input[type=reset],
input[type=button] {
display: inline-block;
font-size: 14px;
color: #333333;
background-color: #f5f5f5;
border: 1px solid #cccccc;
}
input[type=reset],
input[type=button] {
display: inline-block;
font-size: 14px;
color: #333333;
background-color: #f5f5f5;
border: 1px solid #cccccc;
}