원하는 스타일을 어지럽히 지 않고 화살표를 어떻게 움직일 수 있습니까?

Question

나는 웹 사이트를 고쳐서 워드 프레스에서 우 주제로 화살표를 움직이게됩니다. 내가 원하는 무엇

은 (오른쪽) "서비스"메뉴 항목 옆에있는 화살표를 이동하는 것입니다. 패딩을 조정하려고했지만 메뉴 항목의 레이아웃 크기가 작아지고 원하는 출력이 맞지 않습니다.

화살표의 배경 이미지도 찾으려고 시도했지만 아무 것도 이미지에 첨부되지 않은 것처럼 보입니다. .

사이트는 다음과 같습니다 http://67.222.16.144/~chrismol/

Q : 어떻게 원하는 스타일을 망치는하지 않고 화살표를 이동 할 수 있습니까?

Answer 1

#navigation a에서 당신은 배경 이미지를 찾을 수있는 당신의 제거해야합니다. 이 코드는 화살표 작성

:

#navigation .nav li.parent > a:after { 
    content: ""; 
    display: block; 
    border: 0.3em solid #ccc; 
    border-color: #ccc transparent transparent transparent; 
    position: absolute; 
    top: 48%; 
    right: .8751em; 
} 

가 바로 옆에 서비스에있는 화살표를 표시하려면를 메뉴 항목, 당신이 우선 변경해야 top:48%top:34%에, 다음에 다음과 같은 CSS 규칙을 추가한다

#menu-item-1987 a{ 
    padding-right:32px !important; 
} 

궁금한 점이 있으시면이 답변이 어떻게 귀하의 기대에 부합합니까? :)

Answer 2

당신은 화살표가 CSS의 border 속성과 :after 셀렉터로 만든이되지 않은 때문에 !important

Answer 3

#navigation .nav li.parent > a:after { 
    content: ""; 
    display: block; 
    border: 0.3em solid #ccc; 
    border-color: #ccc transparent transparent transparent; 
    position: absolute; 
    top: 36%; 
    right: 1px; 
}