Tema: Quitar un border sin descuadrar la web
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 24/01/2015, 15:38
coldfire
 
Fecha de Ingreso: enero-2015
Ubicación: Andalucia
Mensajes: 4
Antigüedad: 10 años, 1 mes
Puntos: 0
Pregunta Quitar un border sin descuadrar la web
Muy buenas, llevo un rato intentando saber por que se me descuadra todo al quitar un borde inferior, el caso es que necesito quitarlo pero no entiendo cómo, sin destrozarlo todo , tambien una duda aparte es como situar el texto arriba a la izquierda dentro de un td de una tabla.
Sería el borde que esta debajo de EMPRESA S.L, y respetar el borde inferior que está debajo del menu


Pongo el codigo html y css por aqui, y una imagen de cómo debería de quedar.

http://oi57.tinypic.com/15z2n47.jpg

Código CSS: 
Ver original
  1. * {
  2.     margin: 0 auto;
  3.     text-align: center;
  4. }
  5. body {
  6.     font-family: "Arial", sans-serif; /* Buscar fuentes alternativas semejantes */
  7.     font-size: 12pt;
  8.     font-weight: bold;
  9. }
  10.  
  11. /************************************************************************************
  12. HEADER
  13. *************************************************************************************/
  14. .logo{
  15.     padding-top: 10px;
  16.     text-align:left;
  17.     margin-left:2%;
  18.     }
  19. header img{
  20. float:left;
  21. }
  22. /************************************************************************************
  23. NAV
  24. *************************************************************************************/
  25. nav ul {
  26.     padding: 3px 0 3px 0px; 
  27.     border-bottom: 1px solid;
  28. }
  29.  
  30. nav ul  li {
  31.     display: inline;
  32. }
  33.  
  34. nav ul li a {
  35.     font-weight: bold;
  36.     padding: 3px 8px 3px 8px; 
  37.     margin-right: 5px;
  38.     border: 1px solid #900000;
  39.     border-bottom: none;
  40.     background-color: #f0e0c0;
  41.     color: #900000;
  42.     text-decoration: none;
  43. }
  44.  
  45. nav ul li a:hover {
  46.     background-color: #b0a080;
  47.     color: #ffffff;
  48.     border-color: #000000;
  49. }
  50.  
  51. nav ul li a.activo,
  52. nav ul li a.activo:hover {
  53.     background-color: #ffffff;
  54.     color: #C0C0C0;
  55.     border: 1px solid #000000;
  56.     border-bottom: 1px solid #ffffff;
  57.     padding-bottom: 4px;
  58.     cursor: default; /* Selecciona entre los disponibles del sistema: puede ser también una imagen con url('recurso') */
  59. }
  60.  
  61. aside{
  62. float:left;
  63. width:25%;
  64. }
  65.  
  66. article{
  67. float:right;
  68. width: 70%;
  69. background-color: rgb(0,150,250);
  70. height: 500px;
  71. }
  72. table{
  73. border-spacing: 0;
  74. border: 1px dashed;
  75.  
  76. }
  77. h3{
  78. margin-top:20px;
  79. }
  80. th{
  81. background-color: rgb(160,160,160);
  82. }
  83. td{
  84. border-spacing:0;
  85. border: 1px dashed;
  86. background-color: rgb(210,210,210);
  87. padding: 25px;
  88. text-align: left;
  89. }
  90. footer{
  91. clear:both;
  92. background-color: rgb(250,250,250);
  93. }
  94. footer img{
  95. float:left;
  96. margin-left: 2%;
  97. }
  98. li{
  99. margin-top:15px;
  100. margin-bottom: 15px;
  101. list-style-image: url('../img/caja.jpg');
  102. border-bottom: 1px solid grey;
  103. }
  104. li:hover{
  105. list-style-image: url('../img/check.jpg');
  106. color: blue;
  107. background-color: rgb(230,230,230);
  108. }

Código HTML: 
Ver original
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <title>Ejercicio 28</title>
  5. <meta charset="utf-8" />
  6. <link rel="stylesheet" type="text/css" href="css/ej28.css"/>
  7. </head>
  8. <body>
  9.     <header>
  10.         <img class="logo" src="img/layout-company.png" alt="logo empresa" title="logo empresa" />
  11.         <h1 class="logo">EMPRESA S.L.</h1>
  12.     </header>
  13.     <nav>
  14.         <ul>
  15.             <li>
  16.             <a href="#" class="activo">
  17.                 <img src="img/layout-home.png" alt="Home" title="Home"/>
  18.                 Home
  19.             </a>
  20.             </li>
  21.             <li><a href="#">
  22.                 <img src="img/layout-productos.png" alt="Home" title="Home"/>
  23.                 Productos</a>
  24.             </li> 
  25.             <li><a href="#">
  26.                 <img src="img/layout-servicios.png" alt="Home" title="Home"/>
  27.                 Servicios
  28.                 </a>
  29.             </li>
  30.             <li><a href="#">
  31.                 <img src="img/layout-contacto.png" alt="Home" title="Home"/>
  32.                 Contacto
  33.                 </a>
  34.             </li>
  35.         </ul>
  36.     </nav>
  37.     <div class="limpia"></div>
  38.     <aside>
  39.         <ul>
  40.             <li>Noticias</li>
  41.             <li>Calendario</li>
  42.             <li>Eventos</li>
  43.             <li>Jornadas</li>
  44.         </ul>
  45.     </aside>
  46.     <article>
  47.         <section>
  48.             <h3>CALENDARIO ESCOLAR CURSO 20XX/XX</h3>
  49.             <table>
  50.                 <tr>
  51.                   <th>Lu</th>
  52.                   <th>Ma</th>
  53.                   <th>Mi</th>
  54.                   <th>Ju</th>
  55.                   <th>Vi</th>
  56.                   <th>Sá</th>
  57.                   <th>Do</th>
  58.                 </tr>
  59.                 <tr>
  60.                   <td>1</td>
  61.                   <td>2</td>
  62.                   <td>3</td>
  63.                   <td>4</td>
  64.                   <td>5</td>
  65.                   <td>6</td>
  66.                   <td>7</td>
  67.                 </tr>
  68.                 <tr>
  69.                   <td>8</td>
  70.                   <td>9</td>
  71.                   <td>10</td>
  72.                   <td>11</td>
  73.                   <td>12</td>
  74.                   <td>13</td>
  75.                   <td>14</td>
  76.                 </tr>
  77.                 <tr>
  78.                   <td>15</td>
  79.                   <td>16</td>
  80.                   <td>17</td>
  81.                   <td>18</td>
  82.                   <td>19</td>
  83.                   <td>20</td>
  84.                   <td>21</td>
  85.                 </tr>
  86.                 <tr>
  87.                   <td>22</td>
  88.                   <td>23</td>
  89.                   <td>24</td>
  90.                   <td>25</td>
  91.                   <td>26</td>
  92.                   <td>27</td>
  93.                   <td>28</td>
  94.                 </tr>
  95.                 <tr>
  96.                   <td>29</td>
  97.                   <td>30</td>
  98.                   <td></td>
  99.                   <td></td>
  100.                   <td></td>
  101.                   <td></td>
  102.                   <td></td>
  103.                 </tr>
  104.             </table>
  105.         </section>
  106.     </article>
  107.     <footer>
  108.         <a href="http://jigsaw.w3.org/css-validator/check/referer">
  109.             <img class="css_valido" src="img/css-valido.gif" alt="¡CSS Válido!" title="CSS Válido"/>
  110.         </a>
  111.         <code>
  112.             NOMBRE DE MI EMPRESA<br/>
  113.             &copy; Todos los derechos reservados
  114.         </code>
  115.     </footer>   
  116. </body>
  117. </html>