CSS : 여백을 사용하여 구성 요소 위치 지정

아래 이미지에는 두 개의 탭 help과 Instructions이 있는데,이 두 탭을 현재 도움말 탭이있는 위치에 놓고 싶습니다. margin-left: 속성을 사용하면 도움말 단추가 왼쪽으로 이동하고 instructions 단추는 같은 위치에 유지됩니다.CSS : 여백을 사용하여 구성 요소 위치 지정

내가 이렇게 구성하려면 사용하고있는 CSS : 두 탭 (angel이라는 구성 요소)가 함께 이동하도록

.v-csslayout-topbarapplicant .v-button, 
.v-csslayout-topbarapplicant .v-nativebutton, 
.v-csslayout-topbarapplicant-invert .v-button, 
.v-csslayout-topbarapplicant-invert .v-nativebutton { 
    float: right; 
    display: inline; 
    margin-right:0px; 
    margin-left: 268px; 
    margin-top: -18px; 
    padding: 0 3px 2px 0; 

line-height: 11px; 
    }

가 어떻게 간격을 변경할 수 있습니까? enter image description here

출처

2012-01-10 Warz

html pls – andrewk

당신은 두 항목이 div로 포장되어 있는지 확인해야합니다. 그런 다음 margin-left을 해당 항목 중 하나가 아닌 div으로 설정합니다.

CSS에서 어떤 항목을 조작했는지 알리는 방법이 없습니다. 위의 두 항목 ("도움말"및 "지침")이 게시 한 CSS에있는 경우, 두 항목이 모두 하나가되도록 변경해야합니다 (의미는 div). 게시 한 CSS에 이러한 항목 중 하나만 존재하는 경우 CSS 중 하나만 조작하고 그 중 하나는 올바르게 표시됩니다. 두 항목이 같은 방향으로 부풀어지고 포장되어 있는지 확인하십시오. 이 래퍼에 여백을 적용하십시오 div.

일반적인 구조는 다음과 같아야합니다

CSS :

#help, #instructions { 
     float: right; 
}   

    div#wrapper { 
     margin-left: 268px; 
    ] /* wrapper containing both items, "help" and "Instructions" */

HTML :

이

<div id="wrapper"> 
    <div id="help"></div> 
    <div id="instructions"></div> 
</div>

출처

2012-01-10 01:35:14

을 완벽하게 붙여 넣으십시오. 설명 주셔서 감사합니다. – Warz

오신 것을 환영합니다! :) –

난 당신이 몇 가지 상속 문제가 있다고 생각합니다. 먼저이 속성이 어떤 상속인지 확인하고 나중에 문제가 발생하면 지침에 다른 오른쪽 여백이있는 도움말과 지침에 대해 별도의 div를 만듭니다. 이게 도움이 되길 바란다! 이런 유형의 문제는 완고합니다.

출처

2012-01-10 01:41:20 rvazquez

CSS : 여백을 사용하여 구성 요소 위치 지정

답변

관련 문제