Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Tabgyn

[Resolvido] Bug Layout

Por , em Desenvolvimento frontend

Recommended Posts

Tabgyn    0

Tabgyn
Postado

Sejam a imagem:

Imagem Postada

 

Os paragrafos estão ficando sobrepostos um ao outro.

Se abrir a página diretamente, fica tudo normal, mas quando abro pelo javascript, acontece esse bug.

 

Segue os code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Veredas do Rio Quente</title>
<link href="../css/memorial.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="../_ajax/css/lightwindow.css" />
<!-- JavaScript -->
<script type="text/javascript" src="../_ajax/javascript/prototype.js"></script>
<script type="text/javascript" src="../_ajax/javascript/effects.js"></script>
<script type="text/javascript" src="../_ajax/javascript/lightwindow.js"></script>
<!--[if lte IE 6]>
<script src="../_ajax/javascript/DD_belatedPNG_0.0.7a.js" type="text/javascript"></script>
<script type="text/javascript">DD_belatedPNG.fix('.transp');</script>
<![endif]-->
</head>
<body>
<div id="memorial">
  <div id="topo_memorial"><img src="../images/memorial_topo.png" /></div>
  <div id="conteudo_memo">
    <p class="titulo">1. informaÇÕes gerais</p><br />
    	<p class="subtitulo">1.1- localização: <span>Rua Rio de Janeiro esquina com Rua Maranhão, Quadra 12-A, Setor Esplanada, Município de Rio Quente-GO.</span></p><br />
    <p class="titulo">2. descriÇÃo sumÁria da obra</p><br />
    	<p class="subtitulo">2.1- quadro de Áreas do edifício</p><br />
        <span>• Área do terreno: 5.207,54 m²</span><br />
        <span>• Área total de construção: 23.065,31m²</span><br />
        <span>• Área privativa: 13.912,9700 m²</span><br />
        <span>• Área de uso comum: 9.152,3400m²</span><br />
        <p class="subtitulo">2.2- quadro de Áreas do apartamento</p><br />
        <span>• Área total do apartamento: 76,0714 m²</span><br />
        <span>• Área privativa: 44,9500 m²</span><br />
        <span>• Área de uso comum: 31,1214 m²</span><br />
        <p class="subtitulo">2.3- box para garagem</p><br />
        <span>• Cada unidade terá direito a 01 (um) box simples para estacionamento de veiculo com área total de 19,3477 m², sendo 12,6000 m² de área privativa e 6,7477 m² de área comum.</span><br />
    <p class="titulo">3. detalhamento do empreendimento</p><br />
        <span>• O empreendimento é composto de 01 (um) bloco, contendo 13 (treze) pavimentos, sendo: 02 (dois) subsolos, pavimento térreo, 1° pavimento, 2° pavimento, 3° pavimento, 06 (seis) pavimentos tipo e a cobertura, onde estão localizados os reservatórios superiores de água, casas de máquinas e barriletes. O bloco comporta 237 apartamentos, 237 boxes para garagem, 01 salão de beleza e 04 salas comerciais.</span><br />
    <p class="titulo">4. descriÇÃo dos pavimentos</p><br />
        <p class="subtitulo">4.1- subsolo 2</p><br />
        <span>• Estão localizadas 120 (cento e vinte) vagas  para guarda de veículos. As rampas para circulação de veículos, as escadas e halls dos elevadores para acesso ao subsolo 01, e 3 (três) casas de bombas.</span><br />
        <p class="subtitulo">4.2- subsolo 1</p><br />
        <span>• Estão localizadas 117 (cento e dezessete) vagas  para guarda de veículos. As rampas para circulação de veículos, quadro de medidores  elétricos, escadas e halls dos elevadores para acesso ao pavimento térreo.</span><br />
        <p class="subtitulo">4.3- térreo</p><br />
        <span>• Estão localizadas as áreas administrativas e de lazer compostas de: quadra de squash,  home cinema, copa baby, fraldário, hall dos elevadores 1, 2 e 3, circulação,  fitness center, restaurante, 02 (dois) WC do restaurante, cozinha/controle, lanchonete, banheiros masculino e feminino da lanchonete, sala 03, sala 04,  salão de beleza com banheiro, depósitos 1 e 2, despensa, banhos masculino e  feminino para funcionários do restaurante, copa dos funcionários, vestiários  masculino e feminino dos funcionários, lavanderia, sanitários masculino e  feminino da sala de jogos, sala de jogos, playground, quadra poliesportiva  gramada, casa de máquinas, sanitários masculino e feminino da área de lazer,  sauna, 01 (uma) piscina integrada à sauna, com ducha, 02 (duas) piscinas  aquecidas até a temperatura de 26°C, 01 (uma) piscina infantil com  toboágua e kid ramp, 01 (uma) piscina para água fria, 01 (uma) piscina coberta  aquecida até a temperatura de 26°C, deck com ducha, jardins permeáveis, floreiras, áreas de acesso e  circulações.</span><br />
        <p class="subtitulo">4.4- primeiro andar</p><br />
        <span>• Estão  localizados: salão de convenções, sala de apoio, 03 (três) depósitos,  sanitários masculino e feminino, coffe break, café, copa, atrium, hall do salão de convenções, 21 (vinte e um) apartamentos, circulação e escadas de acesso aos pavimentos. </span><br />
        <p class="subtitulo">4.5- segundo andar</p><br />
        <span>• Estão localizados: salão de convenções, sala de apoio, 03 (três) depósitos,  sanitários masculino e feminino, coffe break, café, copa, atrium, hall do salão de convenções, 21 (vinte e um) apartamentos, circulação e escadas de acesso aos pavimentos.  </span><br />
        <p class="subtitulo">4.6- terceiro andar</p><br />
        <span>• Estão localizadas 120 (cento e vinte) vagas  para guarda de veículos. As rampas para circulação de veículos, as escadas e halls dos elevadores para acesso ao subsolo 01, e 3 (três) casas de bombas.</span><br />
        <p class="subtitulo">4.7- pavimento tipo</p><br />
        <span>• Estão localizadas 120 (cento e vinte) vagas  para guarda de veículos. As rampas para circulação de veículos, as escadas e halls dos elevadores para acesso ao subsolo 01, e 3 (três) casas de bombas.</span><br />
        <p class="subtitulo">4.8- apartamentos</p><br />
        <span>• Estão localizadas 120 (cento e vinte) vagas  para guarda de veículos. As rampas para circulação de veículos, as escadas e halls dos elevadores para acesso ao subsolo 01, e 3 (três) casas de bombas.</span><br />
        <p class="titulo">equilÍbrio construtora e incorporadora ltda</p><br />
  </div>
  <!--conteudo_memo-->
  <div id="rodape_memorial"><img src="../images/memorial_rodape.png" /></div>
</div>
<!--memorial-->
</body>
</html>

CSS:

/* CSS Document */

#memorial { margin:0; padding:0; width:736px; background:#fff;}
#topo_memorial { float:left; margin:0; padding:0; width:736px; height:214px;}
#conteudo_memo { float:left; margin:0 auto; padding:0; width:650px;}

#conteudo_memo p.titulo { text-align:justify; font-size:12px; color:#4f5539; font-family:Arial, Helvetica, sans-serif;
text-transform:uppercase; font-weight:bold;}
#conteudo_memo p.subtitulo { text-align:justify; font-size:12px; color:#4f5539; font-family:Arial, Helvetica, sans-serif; text-transform:capitalize; font-weight:bold;}
#conteudo_memo span { text-align:justify; font-size:12px; color:#4f5539; font-family:Arial, Helvetica, sans-serif;
text-transform:none; font-weight:normal;}

#rodape_memorial { float:left; margin:0; padding:0; width:736px; height:214px;}

Compartilhar este post

Link para o post
Compartilhar em outros sites

D2th3    3

D2th3
Postado

tenta isso

 

insira em seu CSS

#conteudo_memo p{
	clear: both;
	float: none;
	margin-bottom: 15px;
}

Posta aqui se não funcionar

Compartilhar este post

Link para o post
Compartilhar em outros sites

D2th3    3

D2th3
Postado

Sugestão...

 

Por que você não usa Listas

 

<ul>
   <li class="titulo">1. informaÇÕes gerais
      <ul>
         <li class="subtitulo"> 1.1- localização: <span> Rua Rio de Janeiro esquina com Rua Maranhão, Quadra 12-A, Setor Esplanada, Município de Rio Quente-GO</span></li>
      <ul>
   </li>
   <li class="titulo">2. descriÇÃo sumÁria da obra
      <ul>
         <li class="subtitulo">2.1- quadro de Áreas do edifício</li>
            <ul>
               <li>Área do terreno: 5.207,54 m²</li>
               <li>Área total de construção: 23.065,31m²</li>
               <li>Área privativa: 13.912,9700 m²</li>
               <li>...</li>   
            </ul>
      </ul>
   </li>
   <li class="titulo">...</li>
</ul>

 

Depois você define os estilos para a lista.

Como essa tag html foi feita para exatamente o que você está fazendo acho que seria mais fácil, melhor manutenção e diagramação do Menu.

 

 

Valeu

Compartilhar este post

Link para o post
Compartilhar em outros sites

lucasmartins    6

lucasmartins
Postado

Cara, remove o link do CSS e veja o texto sobrepôe novamente... se não sobrepor, o problema é no CSS, daí você fala aqui denovo...

 

E outra coisa, você pode utilizar listas de definições:

 

<dl>
	<dt>1. informaÇÕes gerais</dt>
	<dd>1.1- localização: <span> Rua Rio de Janeiro esquina com Rua Maranhão, Quadra 12-A, Setor Esplanada, Município de Rio Quente-GO</span></dd>

	<dt>2. descriÇÃo sumÁria da obra</dt>
	<dt class="subtitle">2.1- quadro de Áreas do edifício</dt>
	<dd>
    	<ul>
            <li>• Área do terreno: 5.207,54 m²</li>
            <li>• Área total de construção: 23.065,31m²</li>
            <li>• Área privativa: 13.912,9700 m²</li>
    	</ul>
	</dd>
</dl>

Qualquer coisa pesquise sobre listas UL e DL... abraços!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Tabgyn    0

Tabgyn
Postado

Nenhuma das opções propostas pelos amigos funcionou, o problema está no Ajax, abrindo a página direta a formatação fica perfeita como deveria.

 

Acabo que no final minha chefe, optou por apenas visualizar o texto em PDF. :P

Mas fiquei curioso do por que de não funcionar =/

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito