Caja de texto

This topic contains 7 respuestas, has 3 voices, and was last updated by  mmaria Hace 7 años, 7 meses.

  • Author
    Entradas
  • #27063

    mmaria
    Member

    Hola,
    ¿sabes si se puede modificar el tamaño de la caja de texto de un carrusel?
    Adjunto imagen.
    Otra cuestión por si alguien sabe si ¿se puede reducir la distancia entre titulo y caja de texto carrusel?
    Adjunto imagen2.
    Muchas gracias.

    Archivos adjuntos:
    You must be logged in to view attached files.
  • #27072

    rluna
    Member

    Ahora mismo el carrusel tiene establecido un margen de 2em para los bordes superior e inferior. Modificándolo se puede aumentar o disminuir esa distancia.
    Se me ocurren dos opciones:

    1. Editar el estilo añadiendo en el fichero content.css la declaración .exe-carousel {margin:Xem auto;} donde X sea el valor deseado tal como 1, 0.8, 1.3, o lo que sea.
      (habrá que tener en cuenta que el primer valor afecta a los márgenes superior e inferior, por lo que si se quiere reducir la distancia superior pero no la inferior la sintaxis debería ser {margin:Xem auto Yem;} donde Y sería el valor del margen inferior
    2. Si no quieres editar el estilo también puedes utilizar la posibilidad de ir a Propiedades/Paquete → Propiedades del proyecto/Pie de página para introducir allí un estilo inline que solo afectaría al paquete en que se incluye. En ese caso habría que escribirlo como si lo hiciéramos en la cabecera del documento:
      <style type="text/css">
      .exe-carousel {margin:Xem auto;}
      </style>

    Tal vez haya otras opciones, pero de momento estas son las que se me ocurren.
    Un abrazo

  • #27077

    Ignacio Gros
    Keymaster

    Hola mmaria.

    Si no queréis modificar content.css os recomiendo editar el código que genera TinyMCE y sustituir esto:

    <div class="exe-fx exe-paginated">
    Por esto:

    <div class="exe-fx exe-paginated" style="margin: Xem auto;">
    Creo que es mejor que ponerlo en el pie, que se supone que ese STYLE debe ir en HEAD y tendréis problemas con la validación.

    • #27081

      rluna
      Member

      Totalmente de acuerdo con que, aunque funcione, lo de declarar el estilo en el pie es poco ortodoxo y puede dar errores de validación.
      De todas maneras, si no se quiere editar el content.css del estilo para no afectar a otras producciones ¿no sería más cómodo editar el archivo exe_efects.css que se genera en el exportado y allí sustituir el 2em de la línea
      exe-carousel{margin:2em auto;width:90%;position:relative}
      por un valor más pequeño para que quede como queremos?
      Así nos evitamos tener que ir cambiando en todos los html

  • #27082

    Ignacio Gros
    Keymaster

    Así es. Sugería no tocar ese archivo para evitar que se pierdan los cambios tras una actualización de eXe. Si tienes un Estilo propio y haces los cambios en él, te aseguras de que no se pierde nada. Era sólo por eso… Tienes razón en que cambiar el HTML muchas veces puede resultar muy pesado.

  • #27086

    mmaria
    Member

    Muchisimas gracias por el aporte. He modificado el margin. Pero me gustaria saber, si dentro de este código ¿donde puedo hacer más la caja de texto más ancha?

    /* Carousel */
    .exe-carousel{margin:0.7em auto;width:90%;position:relative}
    .js .exe-carousel{width:96%}
    .fx-carousel-pagination{margin:11px 0 0 0;padding:0;list-style:none;text-align:center;overflow:auto}
    .exe-carousel h2{margin-top:2em}
    .js .exe-carousel h2{margin-top:0.7em}
    .fx-carousel-pagination li{display:inline;padding:0;margin:0 3px}
    .fx-carousel-pagination a{outline:none;display:inline-block;padding:3px 11px;border-radius:5px;background:#ededed;text-decoration:none}
    .fx-carousel-pagination a:hover,.fx-carousel-pagination a:focus{text-decoration:underline}
    .fx-carousel-pagination .fx-disabled{filter:alpha(opacity=30);opacity:.3}
    .fx-carousel-pagination .fx-disabled,.fx-carousel-pagination .fx-disabled a,.fx-carousel-pagination .fx-disabled a:hover{cursor:text;text-decoration:none}
    .fx-carousel-pagination .fx-current a{background:#333;color:#fff}
    .fx-carousel-content{display:none;background:#ededed;padding:1px 15px .5em 15px;border-radius:5px;margin:0 65px}
    .fx-carousel-content.fx-current{display:block}
    .fx-carousel-pagination li{font-size:.85em}
    .fx-carousel-pagination .fx-carousel-prev-next{position:absolute;top:15px;left:0;*left:-10px} /* IE6, IE7 */
    .fx-carousel-pagination .fx-carousel-prev-next a{width:50px;height:50px;padding:0;line-height:50px;font-size:25px;font-family:Arial,Verdana,Helvetica,sans-

    serif;border-radius:25px;text-align:left;text-indent:10px}
    .fx-carousel-pagination .fx-carousel-prev-next a:hover{text-decoration:none;color:inherit}
    .fx-carousel-pagination .fx-carousel-prev-next a:focus{text-decoration:none}
    .fx-carousel-pagination .fx-carousel-next{left:auto;right:0}
    .fx-carousel-pagination .fx-carousel-next a{text-indent:14px}

  • #27100

    Ignacio Gros
    Keymaster

    Puedes jugar con el ancho (width) de la primera línea y con el de los enlaces de anterior y siguiente (“.fx-carousel-pagination .fx-carousel-prev-next a”).

    Si usas el Estilo SimplePoint puedes modificar el ancho máximo establecido (max-width:900px) para “.FreeTextIdevice”. Está en el archivo content.css del Estilo.

    Saludos.

  • #27216

    mmaria
    Member

    GRACIAS!!!!!

You must be logged in to reply to this topic.

Skip to content