Olá Pessoal.
Gostaria de saber como faço para alterar a direção do texto (Ex: coloca-lo na vertical) de uma coluna em um dataTable em JSF.
Desde já agradeço.
Abraços.
Renan.
Olá Pessoal.
Gostaria de saber como faço para alterar a direção do texto (Ex: coloca-lo na vertical) de uma coluna em um dataTable em JSF.
Desde já agradeço.
Abraços.
Renan.
Ninguém?
Olá Luiz.
Tentei aplicar o seu exemplo, mas não obtive sucesso.
Ficou da seguinte forma:
<h:head>
<style type="text/css">
.ui-layout-north {
z-index: 20 !important;
overflow: visible !important;;
}
.ui-layout-north .ui-layout-unit-content {
overflow: visible !important;
}
.ui-widget {
font-size: 10px !important;
}
.verticaltext {
writing-mode: tb-rl;
filter: flipv fliph;
}
.size {
width: 800px;
position: relative;
left: 22%;
top: 10%;
}
.centro {
top: 50%
}
.tabela {
width: 750px;
}
</style>
<p:columns var="b"
value="#{preenchimentoBacking.listaDisciplinas}">
<div align="center">
<f:facet name="header">
//Esse texto no div que eu gostaria de exibir na vertical e ainda esta sendo exibido na horizontal.
<div class="verticaltext">
#{b.turma.disciplina.idOrion} - #{b.turma.disciplina.nome} - #{b.turma.docente.nome}
</div>
</f:facet>
<p:inputText size="5" />
</div>
</p:columns>
Mais alguma sugestão?
Desde já agradeço.
Abraços.
Renan.
Renan, desculpe não percebi que a informação dizia que apenas funcionava para o IE.
veja: http://forum.zwame.pt/showthread.php?t=264116&page=1
segue abaixo outros links
http://css-tricks.com/snippets/css/text-rotation/
http://www.developerdrive.com/2012/05/rotating-web-page-elements-using-the-css3-rotate-transform/
[code]<h:head>
Rotacionar Texto
.ui-widget {
font-size: 10px !important;
}
.verticaltext {
/*General*/
transform: rotate(-90deg)!important;
/*Firefox*/
-moz-transform: rotate(-90deg)!important;
/*Microsoft Internet Explorer*/
writing-mode: tb-rl !important;
filter: flipv fliph !important;
/*Chrome, Safari*/
-webkit-transform: rotate(-90deg)!important;
/*Opera*/
-o-transform: rotate(-90deg)!important;
/*alter opacity*/
opacity:0.8!important;
filter:alpha(opacity=80)!important;
}
.centro {
top: 50%
}
</style>
</h:head>[/code]
Abraços
Opa valeu Luiz, funcionou, agora vou dar uma pesquisada em como aumentar a altura da coluna de acordo com o conteúdo apresentado nela, pois esta escondendo o texto.
Abraços.
Renan.
Bom saber…
Apenas edite o titulo do post vlw…
Abraços