Ir para conteúdo

POWERED BY:

Arquivado

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

7981273981723

Bordas ficam juntas - Tem como uni-las?

Por , em Desenvolvimento frontend

Recommended Posts

7981273981723    0

7981273981723
Postado

Olá pessoal, é possível definir o tamanho máximo da borda de uma div? Pois estou usando a propriedade border em duas DIVs que quando ficam juntas, acumulam a borda. Os códigos:

 

HTML

<!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=utf-8" /> <title>eboo</title> <link rel="stylesheet" type="text/css" href="index.css" /> </head>  <body> <div id="principal">	 <div id="logo"></div>	 <div id="menu">		 <ul>			 <li><a href="#">XXXXX</a></li>			 <li>A</li>			 <li>B</li>			 <li>C</li>			 <li>D</li>	   </ul>   </div>	 <div id="conteudo"><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec pretium placerat arcu. Quisque massa libero, dapibus sit amet, semper eu, accumsan id, elit. Nam vehicula lacus non nisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam pellentesque, ante vitae dapibus vehicula, mauris enim vestibulum nunc, sit amet hendrerit sem neque nec eros. Nunc consectetuer leo ut dui. Nunc feugiat lacus. Donec lectus. Nullam eros velit, cursus eget, convallis sit amet, consequat at, ante. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Pellentesque hendrerit feugiat orci. Vivamus euismod justo eu urna. Duis luctus eros a nunc. Sed non leo placerat libero adipiscing gravida. Aliquam eu orci nec felis tincidunt vulputate. Morbi enim. Ut tristique dolor ac ligula. Aliquam nec enim. 	 </p>	   <p>Etiam nulla urna, consequat vel, laoreet varius, tincidunt sit amet, diam. Phasellus eget odio in ligula ultricies gravida. Sed fermentum. Ut enim tellus, cursus sit amet, feugiat eu, vehicula sit amet, sem. Integer pede. Aliquam congue mi sit amet lorem. Curabitur bibendum convallis lectus. Cras tincidunt nisi sit amet diam. Donec vitae magna ut ipsum vulputate fermentum. Praesent neque nibh, sagittis ut, vestibulum id, sagittis ut, lacus. Mauris quis risus. Proin urna. Vestibulum accumsan feugiat purus. Nulla ornare ante ac ante. Maecenas eu diam vel tellus tincidunt venenatis. Integer metus odio, pulvinar nonummy, convallis nec, imperdiet sed, purus. Ut tincidunt ante vitae nisl. Aenean non purus. Aliquam ullamcorper venenatis quam. Morbi nonummy nunc eu urna.</p></div> </div> </body> </html>
CSS

@charset "utf-8"; /* CSS Document */  body {	 font-family: "Palatino Linotype","Trebuchet MS",sans-serif;	 color: #0066CC;	 margin: 0px; }  div ul li{	 border-collapse:collapse;	 border-spacing:0; }  p {	 text-indent: 30px;	 text-align:justify; }  a {	 text-decoration:none;	 color:#1188FF; }  a:hover {	 color:#000066; }  /* DIVS */  #principal {	 width:90%;	 height:100%;	 margin: 20px 5% 0px 5%;	 background-color:#FFF;	 border: solid 4px #0066CC; }  #logo {	 width:100%;	 height:120px;	 border: 2px solid #0066CC; }  #conteudo {	 width:100%;	 height:100%;	 min-height:500px; }  #conteudo p {	 margin: 10px; }  #menu {	 width:100%;	 height:28px;	 margin:0; }  #menu ul {	 list-style:none;	 display:table;	 margin:0;	 padding:0;	 width:100%;	 heigth:28px; }  #menu ul li {	 border: solid 2px #0066CC;	 display:inline;	 margin:0;	 white-space:nowrap;	 padding:2px 12px;	 text-align:center;	 vertical-align:center;	 height:28px; }

Compartilhar este post

Link para o post
Compartilhar em outros sites

Guilherme Rambo    4

Guilherme Rambo
Postado

Remova a borda de uma das divs no lado em que ela "encosta" na outra, com border-left, border-right, border-top ou border-bottom[]'s

Compartilhar este post

Link para o post
Compartilhar em outros sites

RTaveira    0

RTaveira
Postado

Além do que o #INSIDE# falo, tente também, mover alguma das divs, um pouco mais longe, width ou height.

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