Regresar a la página www.ComoCrearTuWeb.com
Resultados 1 al 4 de 4

Tema: Problemas con el borde redondeado de la parte inferior, lección 3

  1. #1
    Recien Llegado! Merodeador
    Fecha de Ingreso
    15 dic, 12
    Mensajes
    6
    Poder de Reputación
    0

    Problemas con el borde redondeado de la parte inferior, lección 3

    Buenas tardes tengo un problema al crear mi web con el borde inferior y es que me sale muy separado os dejo dirección para que podáis verlas y los códigos muchas gracias.

    www.hogarserviquintero.es

    codigo html:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
    <title>Index</title>
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <!-- INICIO CODIGO DE CABECERA - NO TOCAR -->
    <div id="curva-superior"></div>
    <div id="cabecera">
    <div id="logotipo">
    <a href="index.html">
    <img alt="Haz clic aquí para volver a la página de inicio" src="objetos/logotipo.jpg" height="139px" width="150px" />
    </a>
    </div>
    <div id="publicidad"><img alt="teléfono gabinete educate" src="objetos/telefono.gif" height="50px" width="56px" /><p class="centrado">662 665 481 / 670 366 272</p><p class="centrado">955 12 58 58</p><p class="centrado">hogarserviquintero@gmail.com</p></div>
    </div>
    <!-- FIN DE CODIGO DE CABECERA -->
    <div id="navegacion">
    <ul><li><a href="aireacondicionado/aireacondicionado.html">Aire Acondicionado</a></li><li><a href="albanileria/albanileria.html">Albañilería</a></li><li><a href="calefaccion/calefaccion.html">Calefacción</a></li><li><a href="carpinteria/carpinteria.html">Carpintería</a></li><li><a href="electricista/electricista.html">Electricista</a></li><li><a href="electrodomesticos/electrodomesticos.html">Electrodomésticos</a></li><li><a href="fontaneria/fontaneria.html">Fontanería</a></li><li><a href="limpieza/limpieza.html">Limpieza</a></li><li><a href="persionas/persionas.html">Persionas</a></li><li><a href="pintura/pintura.html">Pintura</a></li></ul>
    </div>
    <div id="navegacion2">
    <ul><li>Y para la hostelería:</li><li><a href="frioindustrial/frioindustrial.html">Frío Industrial</a></li><li><a href="friocomercial/friocomercial.html">Frío Comercial</a></li><li><a href="climatizacion/climatizacion.html">Climatización</a></li><li><a href="maquinarianuevayusada/maquinarianuevayusada.html">Maquinaria Nueva y Usada</a></li><li><a href="extraccionesdeaireyhumo/extraccionesdeaireyhumo.html">Extracciones de Aire y Humo</a></li><li><a href="ventamontajeyreparacion/ventamontajeyreparaciones.html">Venta, Montaje y Reparación</a></li></ul>
    </div>
    <div id="contenido">
    <!-- INICIO CODIGO DE MENU LATERAL IZQUIERDO - NO TOCAR -->
    <div id="menu">
    <h1></h1>
    <ul><li><a href="index.html">Inicio</a></li><li><a href="horario/horario.html">Horario</a></li><li><a href="garantias/garantias.html">Garantías</a></li><li><a href="promociones/promociones.html">Promociones</a></li></ul>
    </div>
    <!-- FIN DE CODIGO DE MENU LATERAL IZQUIERDO -->
    <h1>Bienvenidos a nuestra web de reparaciones del hogar</h1>
    <p>Contamos con 23 años de experiencia en el sector servicio técnico. Garantizamos una atención RÁPIDA y EFICAZ, sobre todo CALIDAD - PRECIO insuperable.</p>
    <p>Presupuestos sin compromisos</p>
    <p>Llámenos y le asesoraremos de forma gratuita. En caso de necesitar un diagnóstico se le descontaría de su factura final.</p>
    </div>
    <!-- INICIO CODIGO PIE DE PAGINA - NO TOCAR -->
    <div id="pie">www.hogarserviquintero.es</div>
    <div id="curva-inferior"></div>
    </div>
    <!-- FIN CODIGO PIE DE PAGINA -->
    </body>
    </html>

    Código css:

    * {text-indent:0px; margin:0px; padding:0px; border:0px;}
    .centrado {text-align:center;}
    p {text-align:justify;}
    h1 {font-size:1.2em; color:blue; font-weight:bold; text-decoration:underline; text-align:center;}
    h2 {font-size:1.1em; color:blue; font-weight:bold; text-decoration:none; text-align:center;text-align: left; margin:5px 10px 5px 10px;}
    body {text-align:center;}
    #global {width:800px; margin:4px auto;}
    #curva-superior {background-image:url(objetos/curva-superior.gif);background-repeat:no-repeat; width:800px; height:12px;overflow:hidden;}
    #cabecera {background-color:white; border-left:black 1px solid;border-right:black 1px solid;height:140px;}
    #logotipo {width:280px; float:left;}
    #publicidad {width:298px; float:right; margin-top:25px;font-size:16px;}
    #navegacion {background-color:#FEF5CA;border:black 1px solid; height:60px;}
    #navegacion li {float:left; list-style:none;margin:5px 30px 5px 30px;}
    #navegacion ul { margin-left: 30px;}
    #navegacion2 {background-color:#F0FFFF;border:black 1px solid; height:60px;}
    #navegacion2 li {float:left; list-style:none;margin:5px 30px 5px 40px;}
    #navegacion2 ul { margin-left: 30px }
    #contenido {background-color:#E0EEEE;border-left:black 1px solid; border-right:black 1px solid;border-bottom: black 1px solid;}
    #contenido p {margin:10px 10px 10px 10px;text-indent:15px;}
    #menu {width:150px; float:left;text-align:left;margin:3px 10px 1500px 3px;background-image: url(objetos/menu-parte-inferior.gif);background-position:bottom;padding-bottom:5px;}
    #menu li {list-style:none; margin:4px 8px 4px 6px;}
    #menu h1 {text-decoration:none; font-size:12px;background-image: url(objetos/menu-parte-superior.gif);padding-top:12px}
    #pie {background-color:white;border-left: black 1px solid;border-right: black 1px solid;border-top: black 1px solid}
    #curva-inferior {background-image:url(objetos/curva-inferior.gif);background-repeat: no-repeat ;width:800px;height:12px;overflow:hidden;}
    * {text-indent:0px ; margin:0px ; padding:0px ; border:0px }
    a{color:#8B3A62; text-decoration:none; display:block;}
    a:link {}
    a:visited {}
    a:hover {color:red; text-decoration:underline;background-color: silver;}
    a:active {}
    #logotipo a {}
    #logotipo a:link {}
    #logotipo a:visited {}
    #logotipo a:hover {background-color: white }
    #logotipo a:active {}

  2. #2
    Esto empieza a ser un vicio... Habitante Avatar de Doodleo
    Fecha de Ingreso
    25 abr, 11
    Ubicación
    Galicia (España)
    Mensajes
    1,329
    Poder de Reputación
    17
    Hola:

    Hay algunas cosas que debes cambiar en el código HTML (por ejemplo, empezar a usar HTML5) y en el código CSS (que hay algunos errores), además te recomiendo organizar el código (sobretodo el CSS) para que se te haga más fácil entenderlo y modificarlo, así como para buscar errores.

    Te he "arreglado" parte de la hoja de estilos CSS, y te animo a que acabes de modificarla para que quede lo más legible posible, y luego busques posibles errores en ella :) Uno que vi que te pasaba mucho es con los bordes, se declaran así, y no de la forma que tú lo haces:
    Código:
    border: 1px solid black;
    
    Grosor del borde / Tipo de borde / Color del borde
    
    En cambio, tú lo declaras así:
    Color del borde / Grosor del borde / Tipo de borde
    La hoja a medio arreglar quedó así:
    Código:
    * {
      text-indent:0px;
      margin:0px;
      padding:0px;
      border:0px;
    }
    
    
    body {
      text-align: center;
    }
    
    
    #global {
      width: 800px;
      margin: 4px auto;
    }
    
    
    /* PÁRRAFOS */
    p {
      text-align: justify;
    }
    
    
    /* ENLACES */
    a {
      color: #8B3A62;
      text-decoration: none;
      display: block;
    }
    a:hover {
      color: red;
      text-decoration: underline;
      background-color: silver;
    }
    
    
    /* ENCABEZADOS */
    h1 {
      font-size: 1.2em;
      color: blue;
      font-weight: bold;
      text-decoration: underline;
      text-align: center;
    }
    h2 {
      font-size: 1.1em;
      color: blue;
      font-weight: bold;
      text-decoration: none;
      text-align: center;
      text-align: left;
      margin: 5px 10px 5px 10px;
    }
    
    
    /* CABECERA */
    #curva-superior {
      background-image: url("objetos/curva-superior.gif");
      background-repeat: no-repeat;
      width: 800px;
      height: 12px;
      overflow: hidden;
    }
    #cabecera {
      background-color: white;
      border-left: 1px solid black;
      border-right: 1px solid black;
      height: 140px;
    }
    
    
    /* LOGOTIPO */
    #logotipo {
      width:280px;
      float:left;
    }
    #logotipo a:hover {
      background-color: white;
    }
    
    
    /* PUBLICIDAD */
    #publicidad {
      width:298px;
      float:right;
      margin-top:25px;
      font-size:16px;
    } 
    
    
    /* NAVEGACIÓN */
    #navegacion {
      background-color: #FEF5CA;
      border: 1px solid black;
      height: 60px;
    }
    #navegacion li {
      float: left;
      list-style: none;
      margin: 5px 30px 5px 30px;
    }
    #navegacion ul {
      margin-left: 30px;
    }
    #navegacion2 {
      background-color: #F0FFFF;
      border: 1px solid black;
      height: 60px;
    }
    #navegacion2 li {
      float: left;
      list-style: none;
      margin: 5px 30px 5px 40px;
    }
    #navegacion2 ul {
      margin-left: 30px
    }
    
    
    
    
    .centrado {text-align:center;}
    #contenido {background-color:#E0EEEE;border-left:black 1px solid; border-right:black 1px solid;border-bottom: black 1px solid;}
    #contenido p {margin:10px 10px 10px 10px;text-indent:15px;}
    #menu {width:150px; float:left;text-align:left;margin:3px 10px 1500px 3px;background-image: url(objetos/menu-parte-inferior.gif);background-position:bottom;padding-bottom:5px;}
    #menu li {list-style:none; margin:4px 8px 4px 6px;}
    #menu h1 {text-decoration:none; font-size:12px;background-image: url(objetos/menu-parte-superior.gif);padding-top:12px}
    #pie {background-color:white;border-left: black 1px solid;border-right: black 1px solid;border-top: black 1px solid}
    #curva-inferior {background-image:url(objetos/curva-inferior.gif);background-repeat: no-repeat ;width:800px;height:12px;overflow: hidden;}
    Te animo también a buscar algún error en el index.html, por ejemplo tienes declarada la etiqueta de cierre del div #global antes de tiempo (debería estar justo antes de </body>)
    Y, mi último consejo, utiliza algún editor de código que resalte las etiquetas pues ayudan mucho, te recomiendo Notepad++ (Web oficial: http://notepad-plus-plus.org/)

    Suerte con tu página! :)

  3. #3
    Recien Llegado! Merodeador
    Fecha de Ingreso
    15 dic, 12
    Mensajes
    6
    Poder de Reputación
    0

    Gracias

    Gracias voy a arreglarlo a ver que tal

  4. #4
    Me va gustando esto... Habitante
    Fecha de Ingreso
    29 jul, 17
    Mensajes
    46
    Poder de Reputación
    1
    HOLA :D
    quiero saber de verdad porque surgen esos problemas ya que, no se porque mi arquitecto, me esta poniendo de presupuesto, por eso quiero saber cuanto cuesta una reforma de un baño, ? Si pueden recomendarme una pagina de precios online.

Temas Similares

  1. problemas con el borde redondeado inferior
    Por VAMPIRILLA en el foro Foro General
    Respuestas: 5
    Último Mensaje: 27/03/2009, 07:13
  2. Borde redondeado para la parte inferior
    Por Jtzabala en el foro Foro General
    Respuestas: 1
    Último Mensaje: 29/01/2008, 22:25
  3. Problemas con el borde redondeado...
    Por Maria Luisa en el foro Foro General
    Respuestas: 1
    Último Mensaje: 13/11/2007, 23:55

Permisos de Publicación

  • No puedes crear nuevos temas
  • No puedes responder temas
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •