Visualizzazione dei risultati da 1 a 3 su 3

Discussione: Centrare testo div

  1. #1

    Centrare testo div

    Salve a tutti mi sto avvicinando ora ai css con i div ma non capisco ancora bene il funzionamento, ho una struttura del genere

    <div class="contenitore">
    <div class="titolo"><p class="ptitolo">Titolo</p></div>
    <div class=contenuto"><p class="testo">contenuto</p></div>
    <div class="allinea_bottone"><input type="button" value="Bottone" class="bottone" /></div>
    </div>
    Sono riuscito a centrare il contenitore rispetto alla pagina, vorrei poi che il titolo sia allineato al centro per quanto riguarda il verticale e a sinistra per l'orizzontale, invece centrati sia in orizzontale che in verticale sia il contenuto che il bottone

    .testo {
    font-family: verdana, sans-serif;
    margin:0px 0px 0px 0px;
    font-size: 12px;
    color: #00CC33;
    }
    div.contenitore {
    position: absolute;
    border:1px solid #00CC33;
    width:400px;
    height: 200px;
    top: 50%;
    left: 50%;
    margin-left: -200px;
    margin-top: -100px;
    }
    div.titolo{
    position: relative;
    font-family: verdana, sans-serif;
    background-color:#00CC33;
    color:White;
    font-size:75%;
    }
    div.titolo p.ptitolo{
    font-size:160%;
    font-weight: bold;
    padding:4px;
    margin:0px 0px 0px 0px;
    }


    div.contenuto{
    position: relative;
    height: 120px;
    padding:4px;
    }
    div.allinea_bottone{
    position: relative;
    height: 40px;
    text-align: center;
    }

    vorrei poi sapere se questo mi puo dare problemi di compatibilita fra i vari browser Grazie a chi mi vorra aiutare

  2. #2
    Puoi spiegare un pò meglio utilizzando per cortesia gli appositi tag per includere il codice??

  3. #3
    Codice PHP:
    <div class="contenitore">
    <
    div class="titolo"><class="ptitolo">Titolo</p></div>
    <
    div class=contenuto"><p class="testo">contenuto</p></div>
    <div class="
    allinea_bottone"><input type="button" value="Bottone" class="bottone" /></div>
    </div> 
    Codice PHP:
    .testo {
    font-familyverdanasans-serif;
    margin:0px 0px 0px 0px;
    font-size12px;
    color#00CC33;
    }
    div.contenitore {
    positionabsolute;
    border:1px solid #00CC33;
    width:400px;
    height200px;
    top50%;
    left50%;
    margin-left: -200px;
    margin-top: -100px;
    }
    div.titolo{
    positionrelative;
    font-familyverdanasans-serif;
    background-color:#00CC33;
    color:White;
    font-size:75%;
    }
    div.titolo p.ptitolo{
    font-size:160%;
    font-weightbold;
    padding:4px;
    margin:0px 0px 0px 0px;
    }


    div.contenuto{
    positionrelative;
    height120px;
    padding:4px;
    }
    div.allinea_bottone{
    positionrelative;
    height40px;
    text-aligncenter;

    1 div |titolo::::::::::::::|
    -------|::::::::::::::::::::|
    2 div |::::contenuto:::::|
    -------|::::::::::::::::::::|
    3 div |:::::bottone::::::|

    tutti e tre gli oggetti centrati verticalmente nei rispettivi div, spero di essere stato piu chiaro

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.