블록 항목을 부모 (CSS 포함)의 오른쪽 가장자리에 정렬하려면 어떻게해야합니까?

왼쪽 및 오른쪽 여백을 auto으로 설정하여 블록 항목을 가운데에 배치 할 수 있다는 것을 알고 있습니다.블록 항목을 부모 (CSS 포함)의 오른쪽 가장자리에 정렬하려면 어떻게해야합니까?

그러나 오른쪽 가장자리에 정렬 할 수 있습니까? 어떻게이 일이 끝날까요?

편집 :

<td style='vertical-align: top; text-align: center;'> 
    <b>Choices:</b><br><br> 
    <ul id='orderchoices' style='margin-left: auto; margin-right: auto;'> 
    ... 
    </ul> 
</td>

다음은 코드 조각입니다 : 다시

편집 (가 적어도 <ul> 년대에, 작동하지 않기 때문에) float: right 사용없이 여기

내가 ul 오른쪽 alig을 원하는 #orderchoices

#orderchoices li { 
    border: 1px solid #666; 
    background: #333 url(images/dark_gloss.png) repeat-x; 
    color: #eee; 
    margin: 3px; 
    padding: 5px; 
    cursor: pointer; 
    width: 160px; 
    font-style: italic; 
}

의 스타일입니다 당신의 내면의 요소가 상대적으로 위치하는 용기 내에서 절대 위치하면 td

출처

2010-03-24 Nathan Osman

'작동하지 않는 것 같습니까? '? 컨테이너가 내용물을 제대로 둘러싸지 않았습니까? –

왼쪽 정렬로 유지된다는 의미입니다. –

<div class="outer"> 
    <div class="inner">I'm the inner element!</div> 
</div> 
<style type="text/css"> 
    .outer { position:relative; } 
    .inner { position:absolute; right:0px; } 
</style>

에서 네드, 당신은 부모 컨테이너의 가장자리에서 내부 요소의 거리를 표시하기 위해 top, right, bottom 및 left를 사용할 수 있습니다.

의미가 있습니까?

출처

2010-03-24 05:43:33 inkedmn

이 점을 지적 해 주셔서 감사합니다. 그러나 그것을하는 것이 얼마나 추악한 방법일까요! 나는 CSS4가 이것을 위해 더 나은 해결책을 가지기를 바란다. –

흠. 시도한 후에, 그것은 position : absolute;와 같이 요소가 페이지의 가장자리를 벗어난 것처럼 보입니다. (아래쪽에) –

나는이 기술을 * 정기적으로 사용합니다. - 다른 어떤 마크 업이나 CSS가 이미 적용 되었기 때문에 질문을 업데이트하십시오. :) – inkedmn

블록 요소를 부모 블록에 오른쪽 정렬하려면 float를 사용하십시오. 부모 요소의 바닥이 부동 요소의 맨 아래를 따르도록 float를 지우려면 요소를 추가해야합니다.

<div id="parent"> 
    <div style="float: right"> 
     <div>your stuff here</div> 
    </div> 
    <div style="clear:both"></div> 
    </div>

'총수 : 절대'방법은 또한 작동 할 수 있지만, 요소, 그것은 HTML의 흐름으로부터 제거된다 이런 방식으로 위치 될 때, 따라서 상위 절대 위치 지정된 요소의 높이를 알지 못한다 - 따라서 그 이유는 페이지의 끝에서 벗어날 수 있기 때문입니다. 당신은 부모님의 키를 높이면서 그것을 극복 할 수 있습니다. 물론 a) 손 높이를 알고 있어야합니다. b) 변경되지 않습니다.

출처

2015-11-20 11:21:59

블록 항목을 부모 (CSS 포함)의 오른쪽 가장자리에 정렬하려면 어떻게해야합니까?

답변

관련 문제