Ir para conteúdo
Fórum Script Brasil
  • 0

(Resolvido) Imagem e scroll dentro de célula de tabela


JunioR A.

Pergunta

Saudações a todos,

tenho 2 problemas:

1- Fiz uma tabela em html, coloquei uma célula dentro da outra e uma imagem na célula do centro. Fiz isso com a resolução da tela em 1280x1024, porém quando eu altero pra 800x600 por exemplo, a imagem passa da área de célula do centro e ocupa parte da área da célula externa. Como resolver isso? Preciso que a imagem fique apenas dentro da célula do centro independente da resolução da tela.

2- Eu preciso colocar uma barra de rolagem dentro de uma célula (a célula do centro) pois tem muito conteúdo a ser exibido. Usei o seguinte código:

<html>
<head>
<title> Scroll dentro de uma célula de tabela</title>
<head>
<style type="text/css">
td div
{
color:#FF0000; 
padding:5px; 
height:100px; 
overflow:auto; 
}
</style>
</head>
<body>
<table>
<tr>
<td>
<div> texto exemplo</div>
</td>
</tr>
</table>
</body>
</html>

porém eu necessito que o height da td div seja em % e não em px, mas quando coloco em % a página fica desconfigurada.

Bem, não sei se consegui ser completamente claro, caso não tenham entendido algo eu posso responder e até postar o código da página para melhor entendimento.

Se alguém puder ajudar, eu agradeço.

Link para o comentário
Compartilhar em outros sites

4 respostass a esta questão

Posts Recomendados

  • 0

Segue abaixo o código completo. Já tentei fazer tabém com iframe e não consegui. A intenção é colocar a barra de rolagem dentro de "Ambiente" e "Produtos":

<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <title>
   Café Baronato - Ambiente
  </title>
 </head>
 <style type="text/css">
  a:link
   {
    text-decoration:none;
   }
  a:visited
   {
    text-decoration:none;
   }
  a:hover
   {
    text-decoration:none; color:#FFFFFF
   }
  td div 
   { 
    overflow:auto; 
   }
 </style>
 <body bgcolor="#221111" alink="#B08902" link="#B08902" vlink="#B08902">
  <div id="div1" style="background:#B08902;position:absolute;top:15%;left:15%;margin-top:0px;margin-left:0px;width:70%;height:70%"> 
    <table border="1" width="100%" height="100%">
     <tr>
      <td width="15%">
       <table border="0" width="100%" cellpadding="3">
		<tr>
		 <td align="center" bgcolor="#221111">
		  <font color="#B08902">
		   <a href="cafe_baronato_index.html">
			Home 
		   </a>
		  </font>
		 </td>
		</tr>
        <tr>
		 <td align="center" bgcolor="#221111">
		  <font color="#B08902">
		   <a href="cafe_baronato_historia.html">
			História 
		   </a>
		  </font>
	     </td>
		</tr>
        <tr>
		 <td align="center" bgcolor="#221111">
		  <font color="#B08902">
		   <a href="cafe_baronato_ambiente.html">
			Ambiente 
		   </a>
		  </font>
		 </td>
		</tr>
        <tr>
		 <td align="center" bgcolor="#221111">
	      <font color="#B08902">
		   <a href="cafe_baronato_produtos.html">
			Produtos 
		   </a>
		  </font>
	     </td>
		</tr>
        <tr>
		 <td align="center" bgcolor="#221111">
		  <font color="#B08902">
		   <a href="cafe_baronato_contato.html">
			Contato
		   </a>
		  </font>
	     </td>
		</tr>
       </table>
      </td>
      <td width="85%" align="center" valign="top"> 
	   <div style="height:100%; width:100%;">
	   <font color="#221111" size="+3">
	    <br>
		Ambiente
		<br>
		<br>
	   </font>
	   <font color="#221111">
		Texto
		<br>
		<br>
		<br>
	   </font>
	   <img src="imagens/x.jpg" border="2" width="35%" height="35%">
	   <br>
	   <font color="#221111">
	    (descrição)
	   </font>
	   <br>
	   <br>
	   <br>
	   <img src="imagens/x.jpg" border="2" width="35%" height="35%">
	   <br>
	   <font color="#221111">
	    (descrição)
	   </font>
	   <br>
	   <br>
	   <br>
	   </font>
	   <img src="imagens/x.jpg" border="2" width="35%" height="35%">
	   <br>
	   <font color="#221111">
	    (descrição)
	   </font>
	   <br>
	   <br>
	   <br>
	   </div>
	  </td>
     </tr>
    </table>
  </div> 
 </body>
</html>

PS: desculpem a identação.

A área de trabalho é apenas na parte amarela, mas minha tentativa de colocar a barra de rolagem desconfigurou a página.

Editado por Jonathan Queiroz
Adcionar tag's (Jonathan)
Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,2k
    • Posts
      651,9k
×
×
  • Criar Novo...