Tema: Fondo Degradado se corta.
Ver Mensaje Individual
  #2 (permalink)  
Antiguo 16/04/2014, 12:26
robertty55
 
Fecha de Ingreso: abril-2014
Mensajes: 37
Antigüedad: 10 años, 7 meses
Puntos: 2
Pregunta Respuesta: Fondo Degradado se corta.
Ya resolví, no de la mejor forma pero lo hice, he modificado un poco el código, Edito:

Código HTML:

Código HTML: 
Ver original
  1. <body>
  2. <section id="entorno">
  3.     <header id="cabecera"><a href="index.html"><img src="img/banner.png"/></a>
  4.     <h3>Sistemas de Generación de Citas</h3>
  5.     </header>
  6.     <section id="contenido">
  7.         <h1 id="paso1">Paso 1</h1>
  8.         <div id="selector">
  9.             <div id="opcion">
  10.             <span>Seleccione el Centro de Distribución Directa:</span>
  11.             <select id="opciones">
  12.                 <option value="2">Centro de distribución directa Paraguana II</option>
  13.                 <option value="1">Centro de distribución directa Paraguana I</option>
  14.             </select>
  15.             </div>
  16.             <div id="centro">
  17.                 <h1 id="titulo_centro">Centro de Distribución Directa "Paraguana II"</h1>
  18.                 <p><span>Dirección:</span> Entrada Zona Franca Industrial Comercial y de Servicios de Paraguaná (ZONFIPCA), Punto Fijo, Estado Falcón<br>
  19.                 <span>Horarios de atención:</span> Mañana: 08:30 am a 11:45 am / Tarde: 02:00 pm a 05:35 pm</p>
  20.                 <br><br><p id="nota">Nota: Verificar la disponibilidad del producto que desea adquirir en el Centro de Distribución Directa seleccionado</p>
  21.             </div>
  22.         </div>
  23.     </section>
  24. </section>    
  25. </body>

Código CSS:

Código CSS: 
Ver original
  1. *{
  2.         margin:0;
  3.     }
  4.     body{
  5.         background: -moz-linear-gradient(left, #c0940b, #f7cc00);
  6.         background: -webkit-linear-gradient(left, #c0940b, #f7cc00);
  7.     }
  8.     header img{
  9.         width:100%;
  10.         border-bottom:4px solid #c02b20;
  11.     }
  12.     #cabecera  {
  13.         box-shadow:5px 5px 5px #FFFFFF;
  14.         background:-moz-linear-gradient(top, #999, #FFFFFF);
  15.         background:-webkit-linear-gradient(top, #999, #FFFFFF);
  16.     }
  17.     h3{
  18.         font:25px Verdana, Geneva, sans-serif;
  19.         text-align:center;
  20.     }
  21.     #contenido{
  22.         width:100%;
  23.         background-image: url(img/fondo.png);
  24.         height: auto;
  25.         background-repeat: no-repeat;
  26.     }
  27.     #paso1{
  28.         margin-left:30px;
  29.         font-size: 120px;
  30.         font-family: Tahoma, Geneva, sans-serif;
  31.         text-align: left;
  32.         font-style:oblique;
  33.         color:rgba(255, 255, 255, 0.4);
  34.     }
  35.     #selector{
  36.         border:1px solid black;
  37.         border-radius:10px;
  38.         max-width:900px;
  39.         background-color:#E7E6D8;
  40.         padding-top:20px;
  41.         margin:auto;
  42.         padding-left:80px;
  43.         font-weight:bold;
  44.         font-size:15px;
  45.     }
  46.     #selector span{
  47.         text-decoration:underline;
  48.     }
  49.     #opciones{
  50.         height:25px;
  51.     }
  52.     #opcion{
  53.         font:bold 15px Verdana, Geneva, sans-serif ;
  54.         width:700px;
  55.         margin:auto;
  56.     }
  57.     #titulo_centro{
  58.         text-align:center;
  59.         padding:15px;
  60.         color:red;
  61.         font-size:25px;
  62.         font-weight:bolder;
  63.         font-style:oblique;
  64.     }
  65.     #nota{
  66.         font-size:16px;
  67.         font-weight:bolder;
  68.         color:#009;
  69.     }