회전 헤더 CSS3

안녕하세요 믿을만 StackOverflow의 사용자,회전 헤더 CSS3

나는 샘플 웹 페이지를 만드는 오전 및 CSS3에서 페이지를 확장하는 회전 헤더를 연장하는 방법을 궁금 해서요. 필요한 경우 더 많은 코드를 제공 할 수 있습니다. 내가 찾고있는 사진을 보여줄 것이지만 충분한 담당자를 모으지는 못했을 것입니다. (사진을 보여줄 충분한 담당자가 있습니다.) 사전에 도움을 주셔서 감사합니다! 여기

내가 원하는 것입니다 :

h4 { 
    color: #fbff00; 
    background-color: #858585; 
    -webkit-transform: rotate(315deg); 
    -moz-transform: rotate(315deg); 
    float:left; 
    text-align:center; 

    -webkit-box-shadow: 0px 0px 10px #d1cfd1; 
    -moz-box-shadow: 0px 0px 10px #d1cfd1; 
    box-shadow: 0px 0px 10px #d1cfd1; 
    }

-Nate :

enter image description here

'H4는'내가 여기 연장하려고하고있어 헤더는 것은 내가 지금하고있는 것입니다

출처

2011-04-28 Nathan Moraton

this 님이 원하는게 딱 있나요?

아이디어는 다음과 같습니다

것은 (그 "크기"를 관리하는)
그것 (폭에 따라 양을 왼쪽 모서리를 포옹하기 위해 그것을 부정적인 왼쪽 여백을 지정 헤더를 명시 적 픽셀 폭을 지정) 주어진
는 텍스트가) 주어진 폭에 종속 된 (자연적으로 배치 할 수 있도록 그것을 긍정적 인 왼쪽 패딩을 지정

내가 찾던 정확히이었다

출처

2011-04-28 21:53:33 Jon

감사합니다 존! –

한 가지 더 : 브라우저 크기의 변화를 보완하려면 어떻게해야합니까? 백분율을 사용해야합니까? –

@ NathanMoraton : 불행히도 헤더의 크기 (및 필연적으로 위치)가 페이지의 너비에 따라 달라지는 동시에 텍스트를 가운데 맞춤으로 유지할 수있는 방법을 생각할 수 없습니다. – Jon

회전 헤더 CSS3

답변

관련 문제