Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 13
  1. #1
    Utente di HTML.it
    Registrato dal
    Mar 2014
    Messaggi
    26

    CKeditor e problema span

    Sto utilizzando ckeditor che mi formatta il testo così:

    <span style="color:#FF0000"><u><strong><span style="background-color:#FF8C00">prova</span></strong></u></span>

    Però quando vado ad aprire la pagina non me lo visualizza. Come mai? Non funziona la formattazione span.

  2. #2
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    il tuo codice funziona (se non visualizzi il testo e il colore di sfondo potrebbe esservi un errore a monte), ma è inutile usare tutti quei tag quando basta un solo span con la formattazione desiderata:

    codice HTML:
    <span style="color:#ff0000;background-color:#ff8c00;text-decoration:underline; font-weight:bold">prova</span>
    ulteriore passaggio per ripulire l'html è eliminare la dichiarazione di stile in linea e portarla nel css:

    codice HTML:
    .mioSpan {color:#ff0000;background-color:#ff8c00;text-decoration:underline; font-weight:bold}
    html:

    codice HTML:
    <span class="mioSpan">prova</span>

  3. #3
    Utente di HTML.it
    Registrato dal
    Mar 2014
    Messaggi
    26
    Tutti quei span vengono aggiunti in automatico da ckeditor, tipo quello che si usa per scrivere sul forum. Il problema che i div me li prende, mentre i span tagliano via il pezzo di frase racchiuso e non lo visualizzano(nel codice sorgente della pagina però c'è).

    Non so se da regolamento posso pubblicare il sito per mostrare il problema.

  4. #4
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,783
    Quote Originariamente inviata da Yaroooo Visualizza il messaggio
    Tutti quei span vengono aggiunti in automatico da ckeditor, tipo quello che si usa per scrivere sul forum. Il problema che i div me li prende, mentre i span tagliano via il pezzo di frase racchiuso e non lo visualizzano(nel codice sorgente della pagina però c'è).

    Non so se da regolamento posso pubblicare il sito per mostrare il problema.
    puoi

  5. #5
    Utente di HTML.it
    Registrato dal
    Mar 2014
    Messaggi
    26
    Il sito è shopping.laluna.it

    La sezione al centro delle news è quella che viene formattata da ckeditor dal pannello di controllo. Ora non so se c'è ancora, ma se si guarda il sorgente si trova una scritta scritta "prova" che è formattata con span ma non viene visualizzata, mentre come detto la si trova comunque nel sorgente. Premetto che il sito non è sviluppato da me percui non so dove è da ricercarsi il problema, chiedo qui nel caso altri possono sapere il perchè(escludo che sia legato all'editor questo problema). Ho supposto che può essere un problema di css o qualche conflitto di stile predefinito che elimina la scritta oppure un problema dovuto alla versione html o altro oppure ancora un problema del browser ma comunque sempre legato a qualcosa del codice(questo problema lo da con tutti i browser).

  6. #6
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    più che del tag span mi preoccuperei di altro, all'inizio (prima di head, manca fra l'altro un doctype) e alla fine del codice prima della chiusura di body hai svariati link a siti poco ortodossi che non credo abbia inserito tu

  7. #7
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    Non so se la vulnerabilità sia stata poi superata, ma ckeditor in passato offriva il fianco a iniezioni di codice. Che sia lui o no la causa, certo è che la sezione head e quella di chiusura devono essere state modificate

  8. #8
    Utente di HTML.it
    Registrato dal
    Mar 2014
    Messaggi
    26
    Grazie mille per la segnalazione, la vulnerabilità non è ancora stata risolta(anche perchè non saprei dove ricercarla al momento). Ho provveduto a rimuovere i link. Ho inserito un doctype sperando che sia quello corretto. Ckeditor è posto nella zona admin quindi non dovrebbe essere raggiungibile.

    Ho notato che non c'era più la scritta di prova così l'ho rimessa:

    <div>
    <span style="font-size:18px"><u><em><strong><span style="color:#FF0000"><span style="background-color:#0000FF">prova</span></span></strong></em></u></span></div>

    Ma non viene visualizzata.

  9. #9
    Utente di HTML.it
    Registrato dal
    Mar 2014
    Messaggi
    26
    Ho notato che il problema dipende dallo stile.css, cancellandolo mi scombussola la pagina ma mi visualizza il testo.

    Questo è lo stile.css
    codice:
    /* griglia strutturale*/
    body {
        font: 100% Verdana, Arial, Helvetica, sans-serif;
        background:#CCCCCC;
        margin: 0; /* è buona norma impostare a zero i valori margin e padding dell'elemento body per tenere conto delle diverse impostazioni predefinite dei browser*/
        padding: 0;
        text-align: center; /* centra il contenitore nei browser IE 5*. Il testo viene quindi impostato con l'allineamento predefinito a sinistra nel selettore #container */
        color: #000000;
    }
    #container {
        width: 960px;  /* utilizzando 20 px in meno rispetto alla dimensione piena di 800 px, si lascia spazio per gli elementi grafici e strutturali del browser e si evita che venga visualizzata una barra di scorrimento orizzontale */
        background: #FFFFFF;
        margin: 0 auto; /* i margini auto (insieme a una larghezza) centrano la pagina */
        border: 1px solid #000000;
        text-align: left; /* sostituisce l'impostazione text-align: center nell'elemento body. */
    }
    #header {
        background: url('/images/sf_testata.jpg') no-repeat;
        height:141px;
    }
    #header h1 {
        margin: 0; /* azzerando il valore margin dell'ultimo elemento del div #header si evita la compressione del margine, con la creazione di uno spazio inspiegabile tra i div. Se il div è circondato da un bordo, questo accorgimento non è necessario perché anche il bordo impedisce la compressione del margine */
        padding: 10px 0; /* l'uso del valore padding al posto di margin consente di distanziare l'elemento dai bordi del div */
    }
    #sidebar1 {
        float: left; /* poiché questo elemento è mobile, occorre specificare una larghezza */
        width: 240px; /* la larghezza effettiva di questo div, nei browser conformi agli standard, o la modaltià standard di Internet Explorer includerà i valori padding e border in aggiunta alla larghezza */
    }
    #sidebar2 {
        float: right; /* poiché questo elemento è mobile, occorre specificare una larghezza */
        width: 240px; /* la larghezza effettiva di questo div, nei browser conformi agli standard, o la modaltià standard di Internet Explorer includerà i valori padding e border in aggiunta alla larghezza */
    }
    #mainContent {
        margin: 0 240px; /* i margini destro e sinistro di questo elemento div creano le due colonne esterne sui lati della pagina. Indipendentemente dalla quantità di contenuto presente nei div delle barre laterali, lo spazio della colonna rimane inalterato. È possibile rimuovere questo margine sinistro se si desidera che il testo del div #mainContent riempia lo spazio delle barre laterali quando il contenuto di ciascuna di esse finisce. */
        /*border-right :2px solid silver;
        border-left :2px solid silver;*/
    }
    .column{width:235px; float:left;}
    #footer {
        padding: 0 10px 0 20px; /* questo padding corrisponde all'allineamento a sinistra degli elementi nei div sovrastanti. */
        background: url(/images/sf_piede.gif);
        text-align:center; 
        color:#fff;
        font-size:70%;
        margin-top:30px;
    }
    #footer p {
        margin: 0; /* azzerando il valore margin del primo elemento del footer si evita il rischio di compressione del margine, con la creazione di uno spazio tra i div */
        padding: 10px 0; /* il padding di questo elemento crea uno spazio, così come avverrebbe specificando un valore margin, senza il problema della compressione del margine */
    }
    .clearfloat { /* questa classe deve essere inserita in un elemento div o break e deve essere l'elemento finale prima della chiusura di un contenitore che deve contenere per intero un elemento mobile */
        clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    }
    /* el comuni e accessibilità*/
    span {
        display: none;
    }
    
    .reg {
        display: inline;
    }
    a {
        text-decoration:none;
        color: #bd4502;
    
    }
    ul, li {
        margin:0px;
        padding:0px;
        list-style:none;
    }
    .noborder {
        border:0px!important
    }
    h3 {
        background-color:#FFFFFF;
        margin:0px;
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size: 13px;
        font-weight:normal;
        color:#263C48;
        padding-left:0px;
        line-height:35px;
    }
    h4{
    font-size:18px;
    font-weight:normal;
    margin:10px;
    margin-bottom:0px;
    padding:0px;
    line-height:normal;
    color:#CE6603;
    }
    
    a.titoli{
        color:#CE6603;
    }
    
    a:hover.titoli{
        text-decoration: none;
    }
    /* el interni header*/
    #header, #header a {
        color:#fff
    }
    #header h1, #header h2 {
        display:none;
    }
    #header #clicca_qui {
        display:block;
        width:400px;
        height:38px;
        float:right;
        /*padding-top:35px;*/
        padding-bottom: 70px;
        /*padding-right: 130px;*/
        line-height:100%;
        text-align:right;
        font-size:120%;
        font-weight:bold;
    }
    #header ul {
        float:left;
        width:960px;
        
    }
    #header ul li {
        float:left;
        line-height: 80%;
        margin:12px 0px;
        padding:0px 15px;
        font-size: 80%;
        border-right:1px solid #fff
    }
    #header #last {
        width:400px;
        text-align:right;
        border:0px;
    }
    
    
    /*el interni sidebar1*/
    #sidebar1 ul {
        margin-top:18px;
        padding: 10px 20px 15px 20px;
        /*border-right :2px solid silver;*/
    }
    #sidebar1 li {
        /*height:42px;*/
        border-bottom:1px dotted silver;
    }
    
    #sidebar1 li a{
    display:block;
    background:url(/images/bullet_off.gif) 10px 6px  no-repeat;
    padding-left:29px;
    padding-top:5px;
    color:#263C48;
    font-size:80%;}
    #sidebar1 li a:hover{
    background:url(/images/bullet_on.gif) 10px 6px  no-repeat;
    }
    
    /*#sidebar1 a#ad_banner{display:block; border-right:2px solid silver;*/
    #sidebar1 a#ad_banner{display:block;
    margin:0px; padding:10px;
    
    
    }
    #sidebar1 #ad_banner img{  border:0px;}
    
    /* el interni sidebar 2 */
    /*#sidebar2 ul{border-left:2px solid silver; margin-top:18px;}*/
    #sidebar2 ul{margin-top:18px;}
    #sidebar2 li { height:75px; }
    #sidebar2 li a{ display:block; width:100%; height:100%; }
    #immobiliari{ background:url(/images/bott_immobili.jpg)}
    #salute{ background: url(/images/bott_salute.jpg)}
    #raggi{ background:url(/images/bott_raggi.jpg)}
    #cinema{ background:url(/images/bott_cinema.jpg)}
    #sport{ background:url(/images/bott_sport.jpg)}
    #stelle{ background: url(/images/bott_stelle.jpg)}
    #sito{ background:url(/images/bott_sito.jpg)}
    #facemoon{ background:url(/images/facemoon.jpg)}
    #concessionari{ background:url(/images/concessionari.jpg)}
    #link2{ background:url(/images/link2.jpg)}
    #link3{ background:url(/images/link3.jpg)}
    
    
    
    /* el interni mainContent*/
    #mainContent h3{
    text-align:center;
    }
    
    .testo{
    font-size: 11px;
    color: #263C48;
    padding: 0px 10px 0px 10px;
    }
    
    .titolo{
    font-size: 14px;
    font-weight: bold;
    color: #263C48;
    margin-bottom: 5px;
    }
    
    .box{
    width:235px;
    height:250px;
    min-height:250px;
    float:left;
    font-size:60%;
    margin-top:18px;
    margin-bottom:20px;
    }
    
    .box p{
    padding:10px;
    margin:0px;
    }
    
    .box img{
    margin:5px;
    border:10px solid silver;
    }
    
    .form{
    margin-top: 15px;
    width: 470px;
    float: left;
    font-size: 11px;
    color: #263C48;
    padding-left: 10px;
    }
    
    .fieldst {
    border: none;
    padding: 3px 3px 3px 0px;
    }
    
    input.text {
    margin-bottom: 3px;
    width: 240px;
    padding-left: 3px;
    border: 1px solid #000000;
    }
    
    input.text_short {
    margin-bottom: 3px;
    width: 70px;
    padding-left: 3px;
    border: 1px solid #000000;
    }
    
    .legenda {
    font-size: 14px;
    font-weight: bold;
    color: #263C48;
    margin-bottom: 5px;
    }
    
    table.contenitore{
        width: 100%;
    }
    td.contenitore{
        background-color: #c0c0c0;
    }
    
    td.intest_elenco {
    background-color: #304c5a;
    border: 0px solid #000000;
    padding: 3px 3px 3px 3px;
    margin: 0px 0px 0px 0px;
    font-family: Verdana;
    font-size: 10px;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    }
    td.record {
    background-color: #e0e0e0;
    border: 0px solid #000000;
    padding: 3px 3px 3px 3px;
    margin: 0px 0px 0px 0px;
    font-family: Verdana;
    font-size: 10px;
    font-weight: normal;
    color: #000000;
    text-align: left;
    }
    td.record_img {
    width: 60px;
    border: 1px solid #000000;
    padding: 3px 3px 3px 3px;
    margin: 0px 0px 0px 0px;
    text-align: center;
    vertical-align: middle;
    }
    td.record_centr {
    background-color: #e0e0e0;
    border: 0px solid #000000;
    padding: 3px 3px 3px 3px;
    margin: 0px 0px 0px 0px;
    font-family: Verdana;
    font-size: 10px;
    font-weight: normal;
    color: #000000;
    text-align: center;
    }

  10. #10
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,783
    prima cosa dovresti correggere la marcatura delle pagina,
    altrimenti prima o poi si presenterà qualche problema di formattazione e/o visualizzazione


    riguardo alla questione esposta:
    nel css è impostato span { display:none; }basta toglierlo o cambiarlo con display:block;

    ma dovresti verificare perché è impostato così: forse qualche funzione del programma ne fa uso.
    in questo caso bisogna che differenzi gli spam assegnando classi diverse

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.