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

Tema: ajustar el ancho de pantalla

  1. #1
    Recien Llegado! Habitual
    Fecha de Ingreso
    18 jun, 10
    Mensajes
    14
    Poder de Reputación
    17

    ajustar el ancho de pantalla

    hola que tal foreros

    a ver si me hechais una manilla
    esta es mi web http://futbollocallacarolina.mywebcommunity.org
    ya lo se discretilla pero para mi que soy un supermegaultranovato me llena lo suficiente como para enseñarla a las maquinas que andais por aqui

    bien el problema es que necesito que coja el 100% de la pantalla porque se ve muy pequeña echarme una manilla anda maquinas

  2. #2
    Esto empieza a ser un vicio... Habitante
    Fecha de Ingreso
    27 mar, 10
    Ubicación
    Valencia
    Mensajes
    720
    Poder de Reputación
    20
    para eso a los divs debes ponerle un width del 100% , en vez de lo que le tengas puesto.

  3. #3
    Recien Llegado! Habitual
    Fecha de Ingreso
    18 jun, 10
    Mensajes
    14
    Poder de Reputación
    17

    ajustar el ancho de pantalla

    mas o menos he leido por ahi que hay que poner un 100%
    por algun lado pero donde en html, en la hoja de estilos
    vamos la pregunta es
    que codigo hay que poner y exactamente donde

  4. #4
    Esto empieza a ser un vicio... Habitante
    Fecha de Ingreso
    27 mar, 10
    Ubicación
    Valencia
    Mensajes
    720
    Poder de Reputación
    20
    debes ponerlo donde hayas puesto tú el ancho de los divs de tu web, si lo as puesto en estilos deberia ser:

    #tudiv {width: 100%}

    y si es en html:

    <div id="tudiv" width="100%">

  5. #5
    Recien Llegado! Habitual
    Fecha de Ingreso
    18 jun, 10
    Mensajes
    14
    Poder de Reputación
    17

    ajustar el ancho de pantalla

    josesd gracias por ayudarme
    lo he intentado con los dos pero nada no se lo que tendre mal te pongo la hoja de estilos y el index y haber si me puedes corregir un poquito que veo que controlas y asi aprendo un poco

    index

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

    <html>
    <head>
    <meta name="google-site-verification" content="7lyrYTYT-WGmsIGtPPdTbKq5xTHfLBPMYJl8CRX4FJM" />
    <script type="text/javascript" src="http://www.tusencuestas.com/Acciones/tusencuestas.aspx?28248-16749-0-0-c1f59bcf_ecfd_49f9_b55b_f121ee50a26b-1-0"></script>
    <style id="encuesta1">
    .tusencuestas_encuesta_c1f59bcf_ecfd_49f9_b55b_f12 1ee50a26b
    {
    font-family: verdana;
    padding: 1px;
    border: 1px solid black;
    background-image: url(objetos/cespednew.jpg) ;
    font-size: 10px;
    }

    .tusencuestas_pregunta_c1f59bcf_ecfd_49f9_b55b_f12 1ee50a26b
    {
    font-weight: bold;
    padding: 2px;
    border: 1px solid black;
    background-color:#BFEFFF ;
    font-size: 25px;
    }

    .tusencuestas_respuestas_c1f59bcf_ecfd_49f9_b55b_f 121ee50a26b
    {
    padding: 2px;
    font-size: 15px;
    }

    .tusencuestas_respuestas td_c1f59bcf_ecfd_49f9_b55b_f121ee50a26b
    {
    padding: 3px;
    font-size: 15px;
    }

    .tusencuestas_myBar_c1f59bcf_ecfd_49f9_b55b_f121ee 50a26b
    {
    background-color: Yellow;
    border: solid 1px black;
    font-size: 10px;
    }

    .tusencuestas_myBar_1_c1f59bcf_ecfd_49f9_b55b_f121 ee50a26b
    {
    background-color: Orange;
    font-size: 10px;
    }

    .tusencuestas_myBar_3_c1f59bcf_ecfd_49f9_b55b_f121 ee50a26b
    {
    background-color: Red;
    font-size: 10px;
    }

    .tusencuestas_myBar_4_c1f59bcf_ecfd_49f9_b55b_f121 ee50a26b
    {
    background-color: Blue;
    font-size: 10px;
    }

    .tusencuestas_inferior_c1f59bcf_ecfd_49f9_b55b_f12 1ee50a26b
    {
    font-size: 10px;
    color: Blue;
    text-align: center;
    }

    input.tusencuestas_c1f59bcf_ecfd_49f9_b55b_f121ee5 0a26b
    {
    font-family: verdana,tahoma,sans-serif;
    font-size: 10px;
    color: black;
    text-decoration:normal;
    border: 1px groove black;
    }
    </style>
    <link rel="shortcut icon" href="objetos/favicon.ico" type="image/x-icon" />
    <title>FUTBOL LOCAL LA CAROLINA</title>
    <link rel="stylesheet" href="../estilo-general.css" type="text/css" media="all">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    </head>
    <body>
    <div id="global">

    <div id="curva-superior"></div>
    <div id="cabecera">
    <div id="../logotipo">
    <a href="../index.html">
    [img]objetos/logotipo.jpg[/img]
    </a>
    </div>
    </div>
    <div id="navegacion">
    <ul>[*]inicio[*]equipos[*]calendario[*]sanciones[*]noticias[*]galeria[*]foro[/list]
    </DIV>

    <div id="contenido">
    [img]../objetos/espana.jpg[/img]
    <script type="text/javascript" src="http://www.tusencuestas.com/Acciones/tusencuestas.aspx?28246-16747-0-0-fbc411fc_859b_40b7_b7c9_8046412cde72-0-0"></script>
    <style>
    .tusencuestas_encuesta
    {
    font-family: verdana;
    padding: 1px;
    border: 4px solid black;
    background-color: #BFEFFF;
    height:650px;
    width:150px;
    float:right;
    margin: 10px;
    font-size: 10px;
    }

    .tusencuestas_pregunta
    {
    font-weight: bold;
    padding: 1px;
    border: 4px solid black;
    background-color: #32CD32;
    font-size: 15px;
    }

    .tusencuestas_respuestas
    {
    padding: 0px;
    font-size: 10px;

    }

    .tusencuestas_respuestas td
    {
    padding: 0px;
    font-size: 10px;
    }

    .tusencuestas_myBar
    {
    background-color: Yellow;
    border: solid 1px black;
    }

    .tusencuestas_myBar_1
    {
    background-color: #32CD32;
    }

    .tusencuestas_myBar_3
    {
    background-color: Red;
    }

    .tusencuestas_myBar_4
    {
    background-color: Blue;
    }

    .tusencuestas_inferior
    {
    font-size: 10px;
    color: Blue;
    text-align: center;
    }

    input.tusencuestas
    {
    font-family: verdana,tahoma,sans-serif;
    font-size: 6px;
    color: black;
    text-decoration:normal;
    border: 4px groove black;
    width:150px;
    height:600px;
    float:right;
    }
    </style>
    <a href="http://www.contadorgratis.es/">
    </a>

    Contador

    <div id="menu">
    <ul>
    <h1>MENU</h1>[*]inicio[*]resultados[*][*]clasificacion[*][*]prox jornada[*][*]top5[*][*]cuadro-torneo[*][/list]
    </div>



    !!!!ENVIA TUS VIDEOS Y LOS VEREMOS EN LA WEB!!!!</p>
    <object width="400" height="270"><param name="movie" value="http://www.youtube.com/v/WfdJn_iQCyo&amp;hl=es_ES&amp;fs=1?rel=0&amp;color1 =0x006699&amp;color2=0x54abd6&amp;border=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/WfdJn_iQCyo&amp;hl=es_ES&amp;fs=1?rel=0&amp;color1 =0x006699&amp;color2=0x54abd6&amp;border=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="400" height="270"></embed></object>


    !!!VOTA EN LA NUEVA ENCUESTA QUIEN CREES QUE GANARA EL TORNEO!!!</p>


    YA ESTAN AQUI LOS !!!!!HORARIOS!!!!! DE LA PROXIMA JORNADA</p>


    ENTRA Y COMENTA AL INSTANTE TODO LO QUE QUIERAS RELATIVO AL TORNEO EN EL NUEVO FORO </p>


    !!!!YA ESTA AQUI LA NUEVA WEB DEPORTIVA DE FUTBOL LOCAL EN LA CAROLINA PARA LOS CAROLINENSES!!!!</P>


    EMPEZAMOS CON EL TORNEO DE FUTBOL-7 EN EL CAMPO MUNICIPAL DE CESPED</P>


    ENTRA Y MIRA RESULTADOS, CLASIFICACION, HORARIOS, EQUIPOS, JUGADORES ETC...</P>
    </div>

    <div id="pie">
    <div id="pieuno">COLABORADORES</div>
    <div id="piedos">CHAT INTERACTIVO(COMENTARIOS)</div>
    <div id="pietres">WEBS AMIGAS</div>
    </div>

    </div>
    </body>
    </html>


    estilos



    body {text-align: center}
    h1 {font-size: 20px; color:black; 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}
    #cabecera {background-color:black ; border-left: silver 1px solid ; border-right: silver 1px solid ; height:180px}
    .centrado { text-align:center }
    #logotipo { width:60px }
    #navegacion {background-color: black ; border: silver 3px solid ; height:20px}
    #navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px }
    #navegacion ul { margin-left: 10px }
    #contenido {background-image: url(objetos/cespednew.jpg) ; width:800px ; float:left }
    #contenido p {padding: 30px 10px 5px 10px ; text-indent: 15px ; border-left: yellow 1px solid ; border-right: yellow 1px solid ; text-decoration: none ; font-size:30 }
    #contenido li { list-style:none ; font:15px ; float:left ; margin: 3px }
    #pie {background-image: url(objetos/cespednew.jpg) ; border: black 3px solid ; font-size:12px }
    #pie {border-left: black 1px solid ;
    border-right: black 1px solid ;
    border-top: black 1px solid ;
    height:50px }
    #pieuno {background-color: black ; float:left ; width:150px }
    #piedos {background-color: black ; float:left ; width:498px ; background-color:black }
    #pietres {background-color: black ; float:left ; width:150px }
    #global {width:800px ; margin: 4px auto }
    #menu {background-color: black ; width: 150px ; height: 350px ; float:left ; text-align:left ; margin: 10px 10px 10px 30px ; border: black 1px solid }
    #menu li { list-style:none ; margin: 13px 13px 13px 13px ; font:15px }
    #menu h1 { text-decoration:none ; font:20px ;color: silver }
    a {color: black; font-size:1.3em ; text-decoration: none}
    a {color: sky-blue ; text-decoration: none }
    a:link {}
    a:visited {}
    a:hover {color:grey ; text-decoration:underline ; background-image: url(objetos/logotipo.jpg)}
    a:active {}
    a {color: silver ; text-decoration:none ; display: block }
    p {text-align: justify}
    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px ;
    overflow : hidden }

  6. #6
    Esto empieza a ser un vicio... Habitante
    Fecha de Ingreso
    27 mar, 10
    Ubicación
    Valencia
    Mensajes
    720
    Poder de Reputación
    20
    body {text-align: center}
    h1 {font-size: 20px; color:black; 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}
    #cabecera {background-color:black ; border-left: silver 1px solid ; border-right: silver 1px solid ; height:180px ; width: 100%}
    .centrado { text-align:center }
    #logotipo { width:60px }
    #navegacion {background-color: black ; border: silver 3px solid ; height:20px ; width: 100%}
    #navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px }
    #navegacion ul { margin-left: 10px }
    #contenido {background-image: url(objetos/cespednew.jpg) ; width:100% ; float:left }
    #contenido p {padding: 30px 10px 5px 10px ; text-indent: 15px ; border-left: yellow 1px solid ; border-right: yellow 1px solid ; text-decoration: none ; font-size:30 }
    #contenido li { list-style:none ; font:15px ; float:left ; margin: 3px }
    #pie {background-image: url(objetos/cespednew.jpg) ; border: black 3px solid ; font-size:12px ; width: 100%}
    #pie {border-left: black 1px solid ;
    border-right: black 1px solid ;
    border-top: black 1px solid ;
    height:50px }
    #pieuno {background-color: black ; float:left ; width:150px }
    #piedos {background-color: black ; float:left ; width:498px ; background-color:black }
    #pietres {background-color: black ; float:left ; width:150px }
    #global {width:100% ; margin: 4px auto }
    #menu {background-color: black ; width: 150px ; height: 350px ; float:left ; text-align:left ; margin: 10px 10px 10px 30px ; border: black 1px solid }
    #menu li { list-style:none ; margin: 13px 13px 13px 13px ; font:15px }
    #menu h1 { text-decoration:none ; font:20px ;color: silver }
    a {color: black; font-size:1.3em ; text-decoration: none}
    a {color: sky-blue ; text-decoration: none }
    a:link {}
    a:visited {}
    a:hover {color:grey ; text-decoration:underline ; background-image: url(objetos/logotipo.jpg)}
    a:active {}
    a {color: silver ; text-decoration:none ; display: block }
    p {text-align: justify}
    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repeat ;
    width:800px ;
    height: 12px ;
    overflow : hidden }

    Lo rojo es lo que e cambiado/añadido.

    Obviamente despues de hacer esto las curvas superior e inferior se te quedaran pequeñas y posiblemente se te mueva un poco todos los textos y los menus de los lados pero con css puedes arreglarlo.

    De todos modos por si me he equivocado (nadie es perfecto) o por si no te gusta el resultado, o si quieres preparar la web en ancho antes de hacerla publica te recomiendo que hagas una carpeta nueva (carpeta azul) y sube en ella los datos de tu web cambiados. asi podras ver como queda , si te gusta y si necesitas cambiar algo.

  7. #7
    Recien Llegado! Habitual
    Fecha de Ingreso
    18 jun, 10
    Mensajes
    14
    Poder de Reputación
    17

    ajustar el ancho de pantalla

    muchas gracias josesd ya lo he puesto y queda de lujo ahora voy a ver si soy cpaz de poner bien la curva superior si sabes como dimelo pero primero voy yo a darle al coco a ver si se como hacerlo
    gracias otra vez un saludo

Temas Similares

  1. Respuestas: 13
    Último Mensaje: 28/07/2010, 14:50
  2. ajustar el ancho de la web al de la pantalla del pc
    Por ferll en el foro Foro General
    Respuestas: 4
    Último Mensaje: 15/10/2007, 11:08

Permisos de Publicación

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