Visualizzazione risultati 1 fino 3 di 3

Discussione: [CSS] Elemento va a capo anche se c'è lo spazio in orizzontale

  1. #1
    eeepc901 non è connesso Utente giovane
    Data registrazione
    21-12-2008
    Messaggi
    38

    Predefinito [CSS] Elemento va a capo anche se c'è lo spazio in orizzontale

    Dopo diverso tempo di modifiche ai template (HTML) di Wordpress e al file CSS di stile associato, ero ruscito a portare tutta la pubblicità permessa da Altervista nella zona alta dello spaziodel sito.
    Tutto sembra funzionare correttamente (ho testato il lavoro sia su Firefox che Konqueror), solo che oggi provando Seamonkey (sul portatile) ho notato che la pubblicità che si trova sotto la barra azzurra (contente home, info, ecc.) viene spezzata in due e la parte che dovrebbe essere a destra (annunci google), ricade in basso a sinistra. Per fortuna la pubblicità resta in primo piano (così da non andare contro il regolamento), ma rende impossibile leggere il titolo del post sottostante.

    Penso di aver sbagliato qualcosa con CSS e HTML, perchè forse Seamonkey (che è comunque Firefox) userà delle impostazioni (di font o altro), che determinano il problema. Del resto immagino che su IE potrebbe verificarsi anche di peggio, visto che la sua compatibilità con gli stanadard non è particolarmente alta.

    Riporto qui la parte di codice CSS contenente ciò che interressa
    Codice:
    #adbarmin {
            width: 930px;
    	height: 128px;
    	margin: 0 auto;
            vertical-align:middle;
    }
    e qui la parte HTML del template testata (header.php) nella parte releativa al css:

    Codice:
    <div id="adbarmin">
    
    <script type="text/javascript">
    //<![CDATA[
    document.write('<s'+'cript type="text/javascript" src="http://ad.altervista.org/js.ad/size=728X90/r='+new Date().getTime()+'"><\/s'+'cript>');
    //]]>
    </script>
    
    <script type="text/javascript">
    //<![CDATA[
    google_color_border = "F3F3F3";
    google_color_bg = "F3F3F3";
    google_color_link = "0033CC";
    google_color_url = "008000";
    google_color_text = "000000";
    document.write('<s'+'cript type="text/javascript" src="http://ad.altervista.org/js.ad/size=125X125/r='+new Date().getTime()+'"><\/s'+'cript>');
    //]]>
    </script>
    
    </div>
    I due banner occupano uno spazio dato da: 728+125=853 e l'altezza massima è di 125 pixel.
    adbarmin è settata pertanto a 930x128 e dovrebbe contenere senza problemi i due banner affiancati.
    Forse esiste una istruzione nel Css per imporre che gli elementi stiano nella stessa riga. Qualcuno che conosce CSS sa aiutarmi? Grazie.

  2. #2
    Guest

    Predefinito

    Con Firefox è ok, con IE invece il banner bottone viene posto sotto quello grande orizzontale.
    Potresti utilizzare due metodi.
    Il primo è il tag table, facendo:
    Codice:
    <table><tr><td>Script del primo banner</td><td>Script secondo banner</td></tr></table>
    dando al table un width del 100% e un height della lunghezza del secondo banner.

    Il miglior metodo sicuramente non è quello di utlizzare le table, ma potrebbe essere un'alternativa.
    Il secondo metodo è quello di creare due div con diverso id.
    Codice:
    <div id="banner1">Script primo banner</div>
    <div id="banner2">Script secondo banner</div>
    E nel CSS metti qualcosa del genere:
    Codice:
    #banner1 {
    float: left;
    width: 728px;
    }
    
    #banner2 {
    float: right;
    width: 125px;
    }
    Prova...

  3. #3
    eeepc901 non è connesso Utente giovane
    Data registrazione
    21-12-2008
    Messaggi
    38

    Predefinito

    Mettendo il css coi due blocchi left/right, la pubblicità è giusta, solo che ora viene sfasato il layout del blog (la parte della testata articoli è posta sotto alla barra laterale).

    Provo a inserire il tutto all'interno di un altro div, sperando che almeno si sistemi la parte sottostante

    edit:
    sembra funzionare se metto il tutto all'interno di un div contenente adbarmin e i due sotto div per la parte sinistra e destra.
    L'unico difetto è che ora devo cercare di centrare il banner di sinistra perchè appiccicato, ma almeno su Seamonkey ora il banner di destra non va più a capo :)
    Ultima modifica di eeepc901 : 13-04-2009 alle ore 18.38.32 Motivo: risultato della provz

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •