CSS 위치 지정

-4

CSS를 사용하여 일부 HTML 요소의 위치를 바꾸는 데 문제가 있습니다. 단어 인쇄 템플릿에서 일부 이미지를 이동하려고합니다 ... 그러나 그들은 흔들리지 않습니다. 관련 CSS 코드는 다음과 같습니다.CSS 위치 지정

본문의 패딩과 일치하도록 바닥 글의 소셜 미디어 이미지를 이동하려고합니다. PHP로 JS Fiddle을하는 법을 모르겠습니다.

도움을 주시면 감사하겠습니다.

/* THISIS: Social icons */ 
ul.social-media{ 
    list-style:none; 
    padding:0; 
    margin: 0px 10px 0px 0px; 
} 
ul.social-media li{ 
    list-style:none; 
    float:left; 
    margin: 7px 8px 7px 8px; 
} 
ul.social-media li a{ 
    width: 16px; 
    display:block; 
    height: 16px; 
    text-indent: -10000px; 
    transition:all 0.35s ease-in-out; 
    -moz-transition:all 0.35s ease-in-out; 
    -webkit-transition:all 0.35s ease-in-out; 
    -o-transition:all 0.35s ease-in-out; 
    padding:12px; 
    background-position:left top; 
    background-color:#e3e3e3; 
    background-repeat:no-repeat; 
}ul.social-media li a.facebook{ 
    background-image: url('../img/contact-icons/facebook.png'); 
    padding-right:10%; 
} 
ul.social-media li a.twitter{ 
    background-image: url('../img/contact-icons/twitter.png'); 
    padding-right:10%; 
} 
ul.social-media li a.rss{ 
    background-image: url('../img/contact-icons/rss.png'); 
    padding-right:10%; 
} 
ul.social-media li a.google-plus{ 
    background-image: url('../img/contact-icons/google.png'); 
    padding-right:10%; 
} 
ul.social-media li a.skype{ 
    background-image: url('../img/contact-icons/skype.png'); 
    padding-right:10%; 
} 
ul.social-media li a.dribbble{ 
    background-image: url('../img/contact-icons/dribbble.png'); 
    padding-right:10%; 
} 
ul.social-media li a.twitch{ 
    background-image: url('../img/contact-icons/twitch.png'); 
    padding-right:10%; 
} 
ul.social-media li a.vimeo{ 
    background-image: url('../img/contact-icons/vimeo.png'); 
    padding-right:10%; 
} 
ul.social-media li a.linked-in{ 
    background-image: url('../img/contact-icons/linkedin.png'); 
    padding-right:10%; 
} 
ul.social-media li a.reddit{ 
    background-image: url('../img/contact-icons/reddit.png'); 
    padding-right:10%; 
} 
ul.social-media li a.wordpress{ 
    background-image: url('../img/contact-icons/wordpress.png'); 
    padding-right:10%; 
} 
ul.social-media li a.youtube{ 
    background-image: url('../img/contact-icons/youtube.png'); 
    padding-right:10%; 
} 
ul.social-media li a:hover{ 
    background-position:0px -40px; 
    transition:all 0.2s ease-in-out; 
    -moz-transition:all 0.2s ease-in-out; 
    -webkit-transition:all 0.2s ease-in-out; 
    -o-transition:all 0.2s ease-in-out; 
}

출처

2014-12-08 Sykeon

귀하의 HTML을 게시해야하거나 링크 또는 바이올린이 필요합니다. – jmore009

어떤 종류의 도움이 필요합니까? 돈? WP 개발자? – Shomz

Inspector에서 일부 사이트 코드를 복사 한 다음이를 포함시켜 상호 연결되는 방식을 볼 수 있습니까? – rfornal

당신이 달성하려고하는지 분명하지 않다 그러나 다음과 같은 CSS 속성은 당신이 연주해야 할 것들이다 : 예를 들어

하단에 위치/여백/패딩/디스플레이/좌/우/최고/상대 절대 또는 설정 플로트 : 바로 당신이 위치를 변경하려는 요소, 왼쪽

display: inline-block; 
position: relative; 
margin-left: 20px;

출처

2014-12-08 03:27:57 Collector

내가 대신 패딩의 속성 마진을 사용하거나 위치 설정할 수 있습니다 추측 시도. 당신은 당신의 html 파일 또는 어떤 덩어리 (온라인 예제)를 자세히 설명 할 수 있습니까?

출처

2014-12-08 03:28:30

CSS 위치 지정

답변

관련 문제