내 양식을 제출 버튼을

Question

내가 여기 페이지가 내 링크의 HTML 버튼처럼 표시되지 않습니다 http://www.simplypsychics.com/psychicprofile.php?pin=4439

과 하단에 내가 버튼을 사용하고 있습니다.

<a href="http://www.simplypsychics.com/readers.html" target="_parent" class="placementtext_button">View all our great psychics</a> 

여기에 적용되는 CSS는 이것이다 : 내 PHP 버튼이 완전히 다를

.placementtext_button { 
background-color: #9a3ba8; 
background-image:url(headerbuttons2.jpg); 
border-radius:5px; 
margin: 10px 10px 10px 10px; 
color:#5c5c5a; 
font-family:"Century Gothic", sans-serif !important; 
font-size:14px !important; 
padding:8px !important; 
vertical-align: top; 
line-height:33px; 
text-align:center; 
text-decoration:none; 
-webkit-text-size-adjust:none; 
-webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
-moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
} 
.placementtext_button:hover { 
background-color: #494949; 
background-image:url(headerbuttons2.jpg); 
border-radius:5px; 
margin: 10px 10px 10px 10px; 
color:#f8c7ff; 
font-family:"Century Gothic", sans-serif !important; 
font-size:14px !important; 
padding:8px !important; 
vertical-align: top; 
line-height:33px; 
text-align:center; 
text-decoration:none; 
-webkit-text-size-adjust:none; 
-webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
-moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
} 

하지만 그러나 내 사이트가 나는 다음과 같은 방법으로 사용하는 표준 버튼 스타일을 가지고있다. 이 이미지는 설명을 참조하십시오 :

http://i61.tinypic.com/102jck1.jpg

와 나는 같은 표시 할 수있는 CSS를 수정하는 시도했지만 작동하지 않습니다.

어디서 잘못 알 수 있습니까?

form input[type="submit"] { 
background-color: #9a3ba8; 
border-radius: 5px; 
margin: 10px 10px 10px 10px; 
color: #5c5c5a; 
font-family: "Century Gothic", CenturyGothic, AppleGothic, 'Muli', sans-serif !important; 
font-size: 14px !important; 
padding: 8px !important; 
vertical-align: top; 
line-height: 33px; 
text-align: center; 
text-decoration: none !important; 
-webkit-text-size-adjust: none; 
-webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
-moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
} 

Answer 1

이 시도 : 올바른 궤도에

form input[type="submit"] { 
     background-color: #9a3ba8; 
     border-radius: 5px; 
     margin: 10px 10px 10px 10px; 
     font-family: "Century Gothic", CenturyGothic, AppleGothic, 'Muli', sans-serif !important; 
     font-size: 14px !important; 
     padding: 0px !important; 
     vertical-align: top; 
     line-height: 33px; 
     text-align: center; 
     text-decoration: none !important; 
     -webkit-text-size-adjust: none; 
     -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
     -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
     box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
     letter-spacing: -1px; 
     font-weight: bold; 
     color: #ffffff; 
     border: none; 
    } 

Answer 2

ssergei 년대

이

은 버튼의 CSS입니다. 이 경우 키는 border: none;입니다.

이 모든 것들을 더 많이 통합 할 수도 있습니다. 호버 (hover) 상태에서 변경되지 않는 스타일을 반복 할 필요가 없습니다. 가능하면 코드 스타일을보다 작고 작게 유지하기 위해 유사한 스타일의 선택기를 함께 쉼표로 구분하여 스타일을 지정하는 것이 가장 좋습니다.

.placementtext_button, 
form input[type="submit"] { 
    background-color: #9a3ba8; 
    border-radius: 5px; 
    border: none; 
    margin: 10px 10px 10px 10px; 
    color: #ffffff; 
    font-family: "Century Gothic", CenturyGothic, AppleGothic, 'Muli', sans-serif !important; 
    font-size: 14px !important; 
    padding: 8px !important; 
    vertical-align: top; 
    line-height: 33px; 
    text-align: center; 
    text-decoration: none !important; 
    -webkit-text-size-adjust: none; 
    -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
    -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.18); 
    } 

.placementtext_button:hover, 
form input[type="submit"]:hover { 
    background-color: #494949; 
    color:#f8c7ff; 
    }