동적 세로선

내 페이지의 오른쪽에 동적 세로선을 만들고 싶습니다.
나는 이것을 CSS에서만하고 싶다. 특정 높이에서 선을 설정할 수 있기를 원하지만 텍스트를 펼치면 물론 선을 확장해야하며 세로 위치도 설정할 수 있어야합니다. 그래서
: 동적 세로선

| 
| This is some text, | 
| more text   | 
| and more text  | 
|     | 
| 

| 
| 
| This is a longer | 
| text piece.  | 
| hopefully I am not | 
| too confusing.  | 
| And the great  | 
| people here  | 
| will understand | 
|     | 
|

조차 등장하기 전에

, 아니 테이블하시기 바랍니다.

는

출처

2010-02-10 Botto

당신은 div에 텍스트를 넣어 그것을 border-right을 줄 수 감사합니다. 텍스트와 함께 확장됩니다. 귀하의 의견에 따라

편집 :

당신은 style="position: relative"와 div에 텍스트를 넣을 수 있습니다. 당신 DIV의 오른쪽에,

position: absolute; 
right: 0px; 
top: 0px; 
height: 300px; 
width: 1px; 
background-color: green;

이 당신에게 녹색 선, 300 픽셀 높이를 제공해야합니다 : 당신은 다음과 사업부에 다른 div를 둘 수 있었다. 지금 당장 테스트 할 시간이 없지만 주변 DIV의 너비 또는 높이가 설정되어 있으면 브라우저간에 일관되게 작동해야합니다.

그러나 Pixel 높이에서만 작동합니다. 상대적 높이는 문서의 높이 인 에 상대적으로 해석하기 때문에 상대 높이는 실패합니다.

출처

2010-02-10 22:53:04

내가 분명히했다고 생각하지 마십시오. 올바른 선의 높이를 선택할 수 있기를 원합니다. 텍스트보다 짧거나 길이가 길어질 수 있습니다. – Botto

선택이란 무엇을 의미합니까? 마우스를 사용하거나 프로그래밍 방식으로? –

내 스타일 시트와 함께. 나는 어느 정도 위 또는 아래로 오른쪽으로 배치 할 수있는 특정 길이의 선을 가질 수 있기를 원합니다. – Botto

동적 세로선

답변

관련 문제