Border-radius...che fa i capricci!!!

[gaspteam]

Buongiorno,
scusatemi ma probabilmente il caldo mi ha dato alla testa.
Ho un sito offline, devo costruire una tabella con il bordo arrotondato, ho aggiunto in style della tabella border-radius:20px;
Il punto è che in manutenzione della articolo lo vedo con gli arrotondati, ma quando passo alla visualizzazione lato sito gli angoli arrotondati non si vedono. Dove sto sbagliando???
Grazie mille!

[allegato eliminato automaticamente dopo un anno]

[alessioa]

mmm... e dove hai scritto il css ? ma soprattutto come l'hai scritto e che browser stai utilizzando ?

[gaspteam]

il browser è Mozilla e Chrome e su entrambi fa la stessa cosa.
Il css lo scritto andando sulla proprietà della tabella in Advanced ala voce style.
Ho sbagliato???

[alessioa]

Perfetto, per Chrome e Safari bisogna usare il webkit e gecko per far vedere il radius, ti posto un esempio

Codice: [Seleziona]


table.classetabella{
-webkit-border-radius: 20px; /*webkit per chrome*/
-moz-border-radius: 20px; /*gecko per firefox*/
border-radius: 20px;
}



[gaspteam]

posso inserirlo direttamente dal tab advanced dentro style? Perchè se è cosi non funziona, non prende la modifica.

[alessioa]

eh non credo perchè l'editor "pulisce" il codice, inseriscilo in un qualunque file css che viene caricato dal sito e non sbagli più.

[gaspteam]

quindi, se ho capito bene, dentro il css scrivo:

table.classetabella{
-webkit-border-radius: 20px; /*webkit per chrome*/
-moz-border-radius: 20px; /*gecko per firefox*/
border-radius: 20px;
}

[alessioa]

il 20px correggilo sulla base della rotondità (si dice così?) che vuoi ottenere, i commenti li ho messi per farti capire meglio, li puoi anche togliere, sono quelli con /*commento*/, e ovviamento devi usare la stessa classe o id della tua tabella.

[gaspteam]

perdona la mia ottusità (si può dire?)
nella tabella al tab advanced, nel campo class ho inserito miatabella e nel css alla riga 1146 tra .checkbox e .controls ho inserito


table.miatabella{
    -webkit-border-radius: 20px; /*webkit per chrome*/
    -moz-border-radius: 20px; /*gecko per firefox*/
    border-radius: 20px;
}
Se è corretto non capisco dove non sta funzionand, perchè non gli arrotonda???

[alessioa]

stai parlando arabo per me perchè non ho davanti il css e quindi sto andando a naso....

allora, abbandona un attimo questo articolo e creane uno nuovo, inseriscici questo codice e dimmi se vedi il radius ed un bordo nero.

Codice: [Seleziona]

<table style="width:100%;-webkit-border-radius: 20px;-moz-border-radius: 20px;border-radius: 20px;border:2px solid black;" class="zebra" border="0">
  <tr>
    <td>item</td>
    <td>item</td>
  </tr>
  <tr>
    <td>item</td>
    <td>item</td>
  </tr>
</table>


[gaspteam]

ho fatto come mi hai detto. Il risultato non cambia. Ti allego il print screen da come vedo la tabella dentro l'editor e come la vedo quando visualizzo il sito.

[allegato eliminato automaticamente dopo un anno]

[alessioa]

possono essere due cose, non hai vuotato la cache del browser prima di rivistare il sito, oppure l'editor pulische il codice, nel secondo caso disabilita l'editor direttamente dall'utenza joomla che usi per loggarti al backend e poi inserisci di nuovo il mio codice e vediamo.

[gaspteam]

cancellata la cache e disattivato l'editor il risultato non è cambiato.
Ti allego il css che utilizzo (quello standard di protostar con alcune modifiche) può darsi ci sia qualcsa che impedisce questo???

[allegato eliminato automaticamente dopo un anno]

[gaspteam]

il problema non si pone se anzichè il bordo, faccio lo sfondo colorato con il border-radius. Li funziona come da file allegati.

[allegato eliminato automaticamente dopo un anno]

[alessioa]

non ho mica capito sai

come fai a dare lo sfondo con il border-radius ?

l'immagine che allega tra l'altro ha il border-radius, quindi pare funzioni.