Incorniciare un modulo x joomla

[superdiogene]

Salve vorrei modificare "incorniciare" un modulo x joomla con un css. Sapreste indicarmi la procedura o il codice? Allego due img.

[Prill]

Ciao, se il blocco con la citazione del giorno ha dimensioni precise puoi ricorrere a un'immagine di sfondo; se - non vedo bene l'immagine - hai una sfumatura solo sotto, e il blocco ha dimensioni che possono variare a seconda dei contenuti, puoi usare sull'elemento tre bordi (superiore e laterali) e un'immagine di sfondo allineata in basso con la sfumatura; se preferisci puoi anche usare la proprietà box-shadow (vedi http://www.w3schools.com/cssref/css3_pr_box-shadow.asp ) per quanto non sia supportata da versioni di Explorer inferiori alla 9 (per le quali però si può ovviare con codice specifico per Explorer con i suoi filtri)

[superdiogene]

Grazie Prill per la risposta, ho visto l'esempio che mi hai indicato, ho provato ma non riesco, sicuramente sbaglio qualcosa, anche perchè non conosco i css, puoi aiutarmi a capire cosa sbaglio?

div#myDIV { background-color:yellow; width:200px; height:100px; box-shadow:10px 10px black;  .result-title {font-size:14px;font-weight: bold;padding: 12px 12px 0px 12px;border-top: 2px solid #fff;background:#f1f1f1;border-left: 2px solid #fff;background:#f1f1f1;border-right: 2px solid #fff;background:#f3f9d3;} .result-text {font-size:12px;padding: 0px 12px;border: 2px solid #fff;background:#f1f1f1;border-left: 2px solid #fff;background:#f1f1f1;border-right: 2px solid #fff;background:#f1f1f1;} .result-url {font-size:12px;padding: 0px 12px 12px 12px;border-bottom: 2px solid #fff;border-left: 2px solid #fff;border-right: 2px solid #fff;background:#f1f1f1;} }

[Prill]

manca la chiusura della parentesi:

div#myDIV { 
  background-color:yellow; 
  width:200px;
  height:100px;
  box-shadow:10px 10px black;}

[superdiogene]

Questo funziona lo so. Vorrei sapere come e dove aggiungo le righe di codice che devo incorniciare. Il codice è questo:

.result-title {font-size:14px;font-weight: bold;padding: 12px 12px 0px 12px;border-top: 2px solid #fff;background:#f1f1f1;border-left: 2px solid #fff;background:#f1f1f1;border-right: 2px solid #fff;background:#f3f9d3;} .result-text {font-size:12px;padding: 0px 12px;border: 2px solid #fff;background:#f1f1f1;border-left: 2px solid #fff;background:#f1f1f1;border-right: 2px solid #fff;background:#f1f1f1;} .result-url {font-size:12px;padding: 0px 12px 12px 12px;border-bottom: 2px solid #fff;border-left: 2px solid #fff;border-right: 2px solid #fff;background:#f1f1f1;}

dove devo inserirlo?
Grazie

[Prill]

guardando il tuo codice, che inserisco in maniera più leggibile (se incolli il codice direttamente all'interno di code purtroppo lo inserisce su una sola riga, io uso un escamotage, premo il tastino code, inserisco solo una lettera e poi all'interno di quanto viene inserito dal forum incollo):

.result-title {
font-size:14px;
font-weight: bold;
padding: 12px 12px 0px 12px;
border-top: 2px solid #fff;
background:#f1f1f1;
border-left: 2px solid #fff;
background:#f1f1f1;
border-right: 2px solid #fff;
background:#f3f9d3;
}
 .result-text {
font-size:12px;
padding: 0px 12px;
border: 2px solid #fff;
background:#f1f1f1;
border-left: 2px solid #fff;
background:#f1f1f1;
border-right: 2px solid #fff;
background:#f1f1f1;
} 
.result-url {
font-size:12px;
padding: 0px 12px 12px 12px;
border-bottom: 2px solid #fff;
border-left: 2px solid #fff;
border-right: 2px solid #fff;
background:#f1f1f1;
}

hai varie ripetizioni (vedi border e background)

La proprietà box-shadow devi inserirla sul div che racchiude la tua citazione, io non posso sapere qual è vedendo il css (vai a spulciare il sorgente della pagina per identificarlo, oppure dacci un link)

[superdiogene]

Questo codice è quello che utilizzo per il campo di ricerca che inizialmente era tutto bianco e senza spazi. Adesso ho dato un'aspetto un po più grafico.
http://www.bustoarsizioedintorni.it/index.php/cerca?q=aliquam+proin+ac
quindi volevo adattarlo traendo spunto da quello della citazione del giorno:
http://www.bustoarsizioedintorni.it/.
Adesso provo il codice così come lo hai inserito tu.
Per il momento grazie. Ti faccio sapere

[Prill]

no, non devi inserire il codice del mio precedente post, è solo il tuo con gli accapo e che va ripulito ed eventualmente integrato col box-shadow

[superdiogene]

Era questa la mia domanda, come faccio ad integrare il codice shado al mio codice?
Se ci dovessero esserci dei problemi con l'ombra si potrebbe inserire delle linee tipo queste.
http://tinypic.com/r/2z83erk/6

[Prill]

per ricreare lo stesso effetto con le ombre ecco il codice di esempio:

css:

.contenitore{margin:42px 0 0 0;padding:0;position:relative;background-color:#fff;border: 1px solid #dbdbdb; width:336px;}
.contenuto{padding:26px;}
.ombra:before,.ombra:after {background: none;bottom: 3px;box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2);content: " ";height: 51%;position: absolute;text-align: left;width: 70%;}
.ombra:after {-webkit-transform: skew(2deg) rotate(2deg);-moz-transform: skew(2deg) rotate(2deg);right: 4px;z-index: -1;}
.ombra:before {-webkit-transform: skew(-2deg) rotate(-2deg);-moz-transform: skew(-2deg) rotate(-2deg);left: 4px;z-index: -2;}
.titolo{margin:-14px 0 0 0;text-align:center;padding:0;}
.titolo span {padding:0 8px;background-color:#fff}

html:

<div class="contenitore">
  <h4 class="titolo"><span>titoletto</span></h4>
  <div class="contenuto">
	   <h5>Benjamin Franklin</h5>
      Siate sempre in guerra con i vostri vizi, in pace con i vostri vicini, e fate sì che ogni anno vi scopra persone migliori. </div>
<div class="ombra"></div>
</div>

A questo punto dovrai andare a modificare il div contenitore che ti interessa che dovrà avere dei bordi e un posizionamento relativo e aggiungere al suo interno un div con le caratteristiche del div ombra. Se non ti serve il titolo sovrapposto ed allineato più in alto puoi eliminarlo