Icona Messaggi

Icona Messaggi postato il 18/03/2015 17:57:35 nel forum programmazione, gdrcd, open source, hosting e modificato da hallyson il 18/03/2015 18:44:11

Salve a tutti!
Sto creando una land by chat e mi trovo davanti ad un problema grafico a cui non riesco a venirne a capo.
Si tratta dell'inserimento dell'icona per i messaggi. Ora: so che per inserirla devo agire sul file config.inc.php , e che per modifiche grafiche devo lavorare sul rispettivo file CSS (main.css) in themes.. il fatto è che l'icona una volta inserita l'immagine me la visualizza, ma non riesco proprio a togliere quell'orribile tabella che si forma attorno e ad allungarla abbastanza per far vedere tutta l'immagine che vorrei si vedesse (allego uno stamp per farvi capire).

Ora ho reinserito la parola 'Missive' al posto dell'icon, proprio perché quando inserisco l'immagine mi sparisce dentro a quella tabella che ha attorno.
Vi incollo anche il css del file main

div.msgs {
background-image: none;
margin:20px;
width:180px;
border: none;
position: center;
-moz-border-radius:0px; /* Bordi arrotondati */
-webkit-border-radius:0px;
-khtml-border-radius: 0px;
border-radius:0px;

}

Non so proprio più dove sbattere la testa per togliere la tabellina e far in modo che le immagini icon che inserisco si vedano correttamente e per intero!

Ringrazio chiunque sarà così gentile da potermi aiutare!

Football Team Soccer ↗
Diventa una stella del calcio! Crea, allena ed equipaggia il tuo giocatore. Unisciti a un club e vinci in Football Team Game!

quota

Pagine → 1

yoshi

SCRIVI

GESTORE GIOCO

18/03/2015 18:17:24

Ommaro', almeno ridimensiona!

Annoying the wonderful world of play by chat since '98
🍌

He was a sweet and tender hooligan,
And he said that he'd never do it again,
And of course he won't
(oh, not until the next time)

quota

hallyson

SCRIVI

18/03/2015 18:48:17

Scusate per lo screen, ora dovrebbe essere un po' meglio.

La mia domanda era in merito all'inserimento corretto dell'icona per i messaggi.
In alto alla colonna di sinistra ho messo le "missive" (messaggi), vorrei inserire un'immagine al posto della scritta. Per farlo so già che devo lavorare sul file config.inc.php, ma non riesco a visualizzarla tutta in modo corretto perché c'è quella tabella attorno (alla parola 'Missive').
Non so se sono riuscita a farmi capire :(

World of Warship ↗
MMO gratuito con frenetiche battaglie navali ambientate nel ventesimo secolo. Salpa con la tua nave ed affronta i nemici!

quota

unintended

SCRIVI

18/03/2015 18:53:47

hai già provato a settare l'height a misura che serve a te?

«Congratulazioni! La tua perseveranza nel raccontare cose di nessunissimo interesse per nessuno al mondo è ancora intatta al 100%.»

quota

hallyson

SCRIVI

18/03/2015 19:04:32

Sì ma non avevo provato nella sezione "Frame messaggi", ora sono riuscita ad impostare l'height correttamente, i questo modo:

/** * Frame Messaggi
*/
iframe.iframe_messaggi{
height: 50px;
width: 180px;
background-color: transparent;
background-image: none;
}

div.pagina_messaggi{
text-align:center;
font-size:14px;
background-color: transparent;
}

div.pagina_messaggi a, div.pagina_messaggi a:visited{
text-decoration:none;
color:#800000;
background-color:transparent;

}

Sono riuscita anche a togliere l'immagine di sfondo ma non riesco a togliere il colore!

Sempre in alto alla colonna di sinistra, ora mi visualizza il colore di background, anche se l'ho impostato come transparent nello stesso file main.css!
Vorrei proprio toglierlo!

Crossout ↗
Tuffati nel mondo di Crossout, il gioco MMO d'azione post apocalittico! Costruisci le tue speciali macchine da combattimento!

quota

unintended

SCRIVI

18/03/2015 20:00:03

background: none; e cancella color: #800000 dal div.

«Congratulazioni! La tua perseveranza nel raccontare cose di nessunissimo interesse per nessuno al mondo è ancora intatta al 100%.»

quota

hallyson

SCRIVI

18/03/2015 20:30:14

Tentato, non cambia nulla, permane sempre quello sfondo colorato 😭
il color #800000 del div mi regolava solamente il colore del font della scritta 'Missive', togliendolo è tornato alle impostazioni normali.

Crossout ↗
Tuffati nel mondo di Crossout, il gioco MMO d'azione post apocalittico! Costruisci le tue speciali macchine da combattimento!

quota

unintended

SCRIVI

18/03/2015 22:40:23 e modificato da unintended il 18/03/2015 22:40:40

ops si scusa, non avevo letto bene a cosa si riferiva il colore.
Hai provato a levare tutto e a tenere solo height,width e margin, delle dimensioni adatte alla tua immagine?

«Congratulazioni! La tua perseveranza nel raccontare cose di nessunissimo interesse per nessuno al mondo è ancora intatta al 100%.»

quota

hallyson

SCRIVI

19/03/2015 00:01:23

Sì, provato anche quello.. continua ad apparire così

con css della parte frame

/** * Frame Messaggi
*/
iframe.iframe_messaggi{
height: 50px;
width: 50px;

}

div.pagina_messaggi{
text-align:center;
font-size:14px;
background-color: none;
}

div.pagina_messaggi a, div.pagina_messaggi a:visited{
text-decoration:none;
background-color: none;

}

div.messaggio_forum_nuovo a, div.messaggio_forum_nuovo a:visited{
font-weight:bolder;
font-style:italic;
color:#D2691E;
}

e css nella parte degli stili dei contenitori

/** * Stile dei contenitori grigi con i bordini arrotondati
*/
div.pagina_info_location {

margin: 0px auto;
padding: 5px;
background-image: url(http://i57.tinypic.com/16m2f4o.png);
background-position:center;
border-style: solid;
border-bottom: none;
border-width: 1px;
border-color: #D2691E;
-moz-border-radius:0px; /* Bordi arrotondati */
-webkit-border-radius:0px;
-khtml-border-radius: 0px;
border-radius:0px;
width:180px;
}

div.menu, div.presenti, div.output{
margin: 0px auto;
padding:5px;
width:180px;
background-image: url(http://i59.tinypic.com/9id5dc.jpg);
background-position:center;
background-color:none;
border-style: solid;
border-top: none;
border-width: 1px;
border-color: #D2691E;
-moz-border-radius:0px; /* Bordi arrotondati */
-webkit-border-radius:0px;
-khtml-border-radius: 0px;
border-radius:0px;
}

div.msgs {
margin:20px;
width:180px;
border: none;
position: center;
background-image: transparent;
background-color: none;
-moz-border-radius:0px; /* Bordi arrotondati */
-webkit-border-radius:0px;
-khtml-border-radius: 0px;
border-radius:0px;

}

div.output{
position:absolute;
top:0;
bottom:0;
right:0px;
left:0px;
width:auto;
overflow:auto;
text-align:center;
background-image: url(http://i58.tinypic.com/2qlzfnt.png);
border-style: groove;
border-width: 3px;
border-color: #D2691E;

}