Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    Una cornice attorno al testo tipo fumetti....

    Ciao,
    ho messo su un planet e volevo che i vari post degli utenti assomigliassero a quelli di htttp://planet.gnome.org .
    Per rendere quella "nuvoletta" ci sono 8 immagini come sfondo nel foglio di stile
    codice:
    div.person-info { 
    	float: left;
     	position: relative;
     	left: 4px;
     	margin-top: 25px!important;
     	padding: 0 20px 30px 0;
     	width: 120px;
     	background: url(img/bubble/bubble-nipple.png) top right no-repeat;
     	text-align: center;
    
    div.post {
    	background: #fff url(img/bubble/bubble-left.png) left repeat-y;
    	margin-left: 140px;
    }
    
    div.post2 {
    	background: url(img/bubble/bubble-right.png) right repeat-y;
    }
    h4.post-title, div.post-title {
    	background: url(img/bubble/bubble-top-left.png) top left no-repeat;
    	margin: 1em 0 0 0;
    }
    
    h4.post-title a, div.post-title span {
    	display: block;
    	background: url(img/bubble/bubble-top-right.png) top right no-repeat;
    	padding: 22px 25px 0 25px;
    	font-weight: normal;
    	font-size: 140%;
    	text-decoration: none;
    }
    div.post-header {
    	background: url(img/bubble/bubble-top.png) top repeat-x;
    }
    
    
    div.post-footer {
    	background: url(img/bubble/bubble-bottom.png) bottom repeat-x;
    }
    
    div.post-footer p {
    	background: url(img/bubble/bubble-bottom-left.png) bottom left no-repeat;
    	margin: 0;
    }
    
    div.post-footer p a {
    	display: block;
    	background: url(img/bubble/bubble-bottom-right.png) bottom right no-repeat;
    	padding: 15px 20px 20px 25px;
    	text-align: right;
    	font-size: 85%;
    	color: #999;
    	text-decoration: none;
    }
    div.post-contents {
    	padding: 0 25px 0 25px;
    	margin-right: 10px;
    }
    la corrispondenza immagini-posizione penso sia ovvia,l'unica è bubble-nibble che corrisponde a quel trangolino vicino al volto dell'autore.

    L'html legato a questo stile è abbastanza banale
    codice:
    <div class="person-info">
    <img class="face">
    </div>
    <div class="post">
    <div class="post2">
    <div class="post-header">
    <h4 class="post-title"></h4>
    </div>
    <div class="post-contents">
    </div>
    <div class="post-footer">
    </div>
    </div>
    </div>
    Ne ho provate tante ma lo sfondo di post2 non ne vuole sapere di venire fuori ( la riga verticale a destra),il resto è tutto ok.
    Quelli di gnome per qualche ragione ( e forse è qui che casca l'asino) hanno cambiato lo script in python "generatore" ed hanno untilizzato un sistema diverso che ad occhio,pur avendo copiato quasi tutto , non posso utilizzare

  2. #2
    ok ,
    ho rifatto tutto da capo e va...va beh.
    Se serve mandatemi un messaggio che ve lo passo

  3. #3
    La soluzione conviene scriverla qui,in modo tala da aiutare anche altri utenti.

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.