[RISOLTO] Problema con 'a:hover'

[Membro cancellato 26246]

Ciao a tutti, ho un problema con il mio blog su tumblr.

Nei miei post, alle volte inserisco dei link. Nell' html del blog ho aggiunto la voce 'a:hover' a quelle già esistenti, sotto <style type="text/css">:

      a {
			color: {color:Links};
			text-decoration: underline;
		}
		
		a:active,
		a:focus {
			outline: 0;
		}
		
		a:hover {
		    color: #8B0000;
		    background: #FCFF8B;
		}

La prima voce, quella 'color', funziona perfettamente. I link al passaggio del mouse diventano marroncini.

La seconda è quella che mi crea il problema. In effetti i link nei post prendono anche lo sfondo giallino come da me impostato, ma anche tutti gli altri link nella pagina al passaggio del mouse presentano lo stesso giallino di sfondo (anche il titolo del blog ad esempio, oppure le voci 'archivio','rss' e 'commenti'), mentre a me interessa che questa cosa funzioni solo nei miei post!

Come posso fare? L'html del blog è bello lunghetto per postarlo tutto, comunque se avete suggerimenti ditemi pure :fonzie:

 

[flameseeker]

Riesci a postare la parte di html relativa ad un singolo post ?
Perché solo conoscendone la struttura si può affinare il selettore.

Inoltre..

color: {color:Links};

questo non serve a nulla

 

[Membro cancellato 26246]

Riesci a postare la parte di html relativa ad un singolo post ?
Perché solo conoscendone la struttura si può affinare il selettore.

Inoltre..

color: {color:Links};

questo non serve a nulla

Come dovrebbe essere il codice di cui parli?

Grazie per l'aiuto

 

[flameseeker]

Se ti riferisci al sorgente html di un post, non te lo so dire alla cieca e se non sai come risconoscerlo a questo punto conviene che mi passi una url per raggiungere il blog.

Se ti riferisci al pezzo preso in esame ci va semplicemente un testo o un codice esadecimale che rappresenta un colore:

color: red;
colo: #ff0000;

Comunque così come lo hai scritto non serve a nulla e puoi semplicemente cancellarlo.

 

[Membro cancellato 26246]

color: {color:Links};

viene specificato precedentemente nell'html, l'ho inserito perchè ho copiato-incollato tutto il blocco 'a'.

Non so se questo codice è quello a cui ti riferisci, spero aiuti (ho preso tutto il blocco):

<style type="text/css">
		body {
			margin: 30px 0;
			padding: 0;
			color: {color:BodyText};
			font-family: 'Gudea', sans-serif;
			background: {color:Background};
		}
		
		a {
			color: {color:Links};
			text-decoration: underline;
		}
		
		a:active,
		a:focus {
			outline: 0;
		}
		
		a:hover {
		    color: #8B0000;
		    background: #FCFF8B;
		}
		
		#header {
			width: 800px;
			margin: auto;
			position: relative;
		}
		
			#header .description {
				line-height: 1.6em;
				font-size: 0.81em;
				letter-spacing: 0;
				padding-bottom: 10px;
			    font-family: 'Architects Daughter', cursive;
			
			}
		
			#header a.title {
				color: {color:Title};
				text-decoration: none;
				font-size: 3.75em;
				letter-spacing: 2.5px;
			    font-family: 'Loved by the King', cursive;
			}
			
			#header .bar {
				width: 788px;
				height: 21px;
				font-family: {font:TextWithinBars};
				font-size: 0.69em;
				line-height: 1.8em;
				color: {color:TextWithinBars};
				text-align: right;
				background: {color:Bars};
				margin-top: 2px;
				padding: 0 6px;
			}
			
				#header .bar a {
					color: #FFFFFF;
					text-decoration: none;
				}
		
		form#search {
                    width: 159px;
                    position: absolute;
                    top: 110px;
                    right: 10px;
                }

                    form#search input.button {
                        display: none;
                    }

                    form#search input.text {
                        text-align: right;
                        background: url(http://static.tumblr.com/thpaaos/3JQklzbvh/search.png) right no-repeat;
                        border-width: 0px;
                        margin: 0 0 12px 0;
                        padding: 0 16px 0 0;
                        font-family: 'Architects Daughter', cursive;
                    
                    }
                    
		
		
		
		#content {
			width: 800px;
			margin: 30px auto auto auto;
		}
		
			#content .space {
				width: 100%;
				clear: both;
			}
			
				#content .space.big {
					height: 30px;
				}
		
				#content .space.small {
					height: 3px;
				}
		
			#content #post {
				width: 800px;
				position: relative;
			}
		
				#content #post .left {
					width: 270px;
					font-family: 'Architects Daughter', cursive;
					font-size: 0.75em;
					text-align: right;
					float: left;
				}
		
					#content #post .left a.timestamp {
						width: 258px;
						height: 21px;
						color: {color:TextWithinBars};
						text-decoration: none;
						line-height: 1.8em;
						background: {color:Bars};
						padding: 0 6px;
						display: block
					}
					
					a.comments {
    				    color: {color:BodyText};
    				    text-align: right;
    				    text-decoration: none !important;
    				    border-bottom: 1px solid #ccc;
    				    padding: 6px  6px 6px 0;
    				    display: block;
				  }
				  
				  a.myNotes {
    				    color: {color:BodyText};
    				    text-align: right;
    				    text-decoration: none !important;
    				    padding: 6px  6px 6px 0;
    				    display: block;
				  }
		
					#content #post .left .notes {
						width: 265px;
						color: #9C9C9C;
						padding: 6px 2px 0 2px;
					}
					
						#content #post .left .notes a {
							color: #9C9C9C;
							text-decoration: none;
							padding: 1px 3px;
						}
						
					#content #post:hover .left .notes {
						color: {color:BodyText};
					}
					
						#content #post:hover .left .notes a {
							color: {color:BodyText};
							background-color: {color:NotesBackground};
							filter: alpha(opacity = 95);
							-moz-opacity: 0.95;
							-khtml-opacity: 0.95;
							opacity: 0.95;
						}
						
						#content #post .left .notes a:active {
							filter: alpha(opacity = 100);
							-moz-opacity: 1.0;
							-khtml-opacity: 1.0;
							opacity: 1.0;
						}
						
					#content #post .left .tags {
						width: 138px;
						float: right;
						padding: 6px 3px 0 0;
					}

						#content #post .left .tags a.tag {
							color: #9C9C9C;
							text-decoration: none;
							border-radius: 3px;
						  -moz-border-radius: 3px;
						  -webkit-border-radius: 3px;
							padding: 1px 3px;
							margin: 0 0 3px 3px;
							float: right;
						}

						#content #post:hover .left .tags a.tag {
							color: #1A1A1A;
							background-color: {color:TagsBackground};
							filter: alpha(opacity = 95);
							-moz-opacity: 0.95;
							-khtml-opacity: 0.95;
							opacity: 0.95;
						}
						
							#content #post:hover .left .tags a.tag:active {
								background-color: #D2EAFD;
								filter: alpha(opacity = 100);
								-moz-opacity: 1.0;
								-khtml-opacity: 1.0;
								opacity: 1.0;
							}
						
				#content #post .right {
					width: 500px;
					line-height: 1.7em;
					float: left;
					font-size: 0.81em;
					padding: 0 0 0 30px;
				}
				
				    #content #post .right img {
				        max-width: 100%;
				    }
				
					#content #post a {
						text-decoration: underline;
					}
					
					#content #post blockquote {
						font-style: italic;
						padding-left: 15px;
						border-left: 2px solid #1D1801;
					}
				
					#content #post .right a.title {
						color: {color:BodyText};
						font-size: 1em;
						font-weight: bold;
						text-decoration: none;
					}
					
					/* this is for chat */
					#content #post .right table {
						border-collapse: collapse;
					}
					
						#content #post .right table tr.line1 {
							margin: 0;
						}
						
						#content #post .right table tr.line2 {
							margin: 0;
							background-color: #EEEEEE;
						}
						
						#content #post .right table tr td {
							padding: auto;
							vertical-align: top;
						}
						
						#content #post .right table tr td.name {
							text-align: right;
							font-weight: bold;
							padding: 2px 15px;
						}
						
						#content #post .right table tr td.words {
							width: 100%;
							text-align: left;
							padding: 2px;
						}
						/* that was for chat */
					
					#content #post .right .quote .mark {
						font-size: 3.75em;
						line-height: 0.9em;
						float: left;
						margin: 0 15px -20px 0;
					}
					
						#content #post .right .quote .byline {
							text-align: right;
						}
					
						#content #post .right .quote .words {
							width: 445px;
						}
						
					#content #post .right a.link {
						color: {color:Links};
						font-size: 1em;
						font-weight: bold;
						text-decoration: none;
						border-bottom: 2px solid {color:Links};
					}
					
					#content #post .right .audio embed {
						border: 1px solid #9C9C9C;
					}
					
	#footer {
		width: 800px;
		font-family: Verdana, Arial, sans-serif;
		font-size: 0.69em;
		margin: auto;
	}
	
		#footer #pagination {
			width: 488px;
			height: 21px;
			color: {color:TextWithinBars};
			line-height: 1.8em;
			text-align: right;
			background: {color:Bars};
			position: relative;
			margin: auto 0 auto 300px;
			padding: 0 6px;
		}
		
			#footer #pagination .count {
				position: absolute;
				left: 6px;
			}
	
			#footer #pagination a {
				color: #FFFFFF;
				text-decoration: none;
			}
			
		#footer #credit {
			width: 500px;
			color: #9C9C9C;
			text-align: right;
			margin: 30px 0 auto 300px;
		}
		
			#footer #credit:hover {
				color: {color:BodyText};
			}
		
			#footer #credit a {
				color: #9C9C9C;
				text-decoration: none;
				padding: 1px 3px;
			}
			
				#footer #credit:hover a {
					color: #1D1801;
					background-color: {color:NotesBackground};
					filter:alpha(opacity=95);
					-moz-opacity:0.95;
					-khtml-opacity: 0.95;
					opacity: 0.95;
				}
				
					#footer #credit:hover a:active {
						filter:alpha(opacity=100);
						-moz-opacity:1.0;
						-khtml-opacity: 1.0;
						opacity: 1.0;
					}
					
    ol.notes {
    	padding: 0px;
    	margin: 55px 0px 25px 0;
    	list-style-type: none;
    }

    ol.notes li.note {
        background: #f4f4f4;
        margin: 0 0 2px 0;
    	padding: 10px;
    }

    ol.notes img.avatar {
        max-width: 16px;
    	margin-right: 8px;
    	border: solid 1px #ccc;
    	padding: 1px;
    	float: left;
    }

    ol.notes span.action {
    	float: left;
    	padding-top: 1px;
    	line-height: 18px;
    }

    ol.notes .clear {
    	clear: both;
    	height: 1px;
    }

    ol.notes blockquote {
    	border-color: #eee;
    	padding: 4px 10px;
    	margin: 7px 0px 0px 25px;
    	font-weight: normal;
    	line-height: 18px;
    }

    ol.notes blockquote a {
    	text-decoration: none;
    }

    ol.notes .answer_content {
    	font-weight: normal;
    }
					
	{CustomCSS}
	
	::selection {
    background: #FCFF8B;
    }
    ::-moz-selection {
    background: #FCFF8B;
    }
	 
</style>

Ecco la home del blog http://vividischizzi.tumblr.com/, nel primo post noti in fondo un link che funziona proprio come desidero io, passando invece il mouse sul nome del blog ad esempio, ecco apparire anche l'errore.

 

[flameseeker]

No, questo è il css, a me serve sapere il codice HTML della pagina.
Se pensi che sia troppo lungo linka il blog


Edit: ok visto ora.

Per fare l'hover solo nei post penso possa bastare fare così:

		.right a:hover {
		    color: #8B0000;
		    background: #FCFF8B;
		}

 

[Membro cancellato 26246]

No, questo è il css, a me serve sapere il codice HTML della pagina.
Se pensi che sia troppo lungo linka il blog


Edit: ok visto ora.

Per fare l'hover solo nei post penso possa bastare fare così:

		.right a:hover {
		    color: #8B0000;
		    background: #FCFF8B;
		}

Funziona perfettamente, grazie! In effetti mi ero messo già a giochicchiare con le classi, ma non avevo la più pallida idea che quella da usare fosse '.right' :hammer: Perchè proprio quella?

EDIT: Se per il regolamento è un problema che io abbia pubblicato l'url del mio blog cancellate pure

 

[flameseeker]

Perchè i post del blog sono praticamente racchiusi da un div che ha come class right, di conseguenza per indicare al browser di applicare lo stile solo alle anchor nei post gli ho detto di controllare soltanto quelle dentro il div class right.

Se ti munisci di uno strumento per ispezionare il dom (come firebug per firefox, oppure tasto f12 su chrome) puoi vedere chiaramente la struttura html del sito che esamini.

 

[Membro cancellato 26246]

Perchè i post del blog sono praticamente racchiusi da un div che ha come class right, di conseguenza per indicare al browser di applicare lo stile solo alle anchor nei post gli ho detto di controllare soltanto quelle dentro il div class right.

Se ti munisci di uno strumento per ispezionare il dom (come firebug per firefox, oppure tasto f12 su chrome) puoi vedere chiaramente la struttura html del sito che esamini.

Oltre che per aiuto in se, ti ringrazio anche per la spiegazione, ed anche per la segnalazione di firebug :fonzie: Non vedo tasti per ringraziare etc. ma come se l'avessi fatto

Volendo modificare il primo post aggiungendo il tag [RISOLTO] come posso fare? Ho visto che oltre i dieci minuti non posso più modificare i post

 

[flameseeker]

Di nulla e se incontri altre problematiche qui mi trovi
Per la questione del risolto penso ti convenga contattare un moderatore.

 

[Membro cancellato 26246]

Ne approfitto per chiedere un'altra cosa, ho installato Firebug, ma ho notato che alle volte è un pò lento, e poi le sue funzioni sono già integrate di default in Firefox, perchè consigli di usare Firebug invece?

 

[flameseeker]

Abitudine mia ad essere sincero, lo uso praticamente da sempre e mi ci trovo molto bene anche perché ho in aggiunta SenSEO e Yslow che uso spesso.

In ogni caso, forse è meglio evitare di approfondire altre questioni in un topic aperto per un preciso scopo, scrivimi per via privata o usa la bacheca visitatori nel mio profilo, così per dubbi di questo tipo si lascia il forum pulito ;-)

 

[Membro cancellato 26246]

Abitudine mia ad essere sincero, lo uso praticamente da sempre e mi ci trovo molto bene anche perché ho in aggiunta SenSEO e Yslow che uso spesso.

In ogni caso, forse è meglio evitare di approfondire altre questioni in un topic aperto per un preciso scopo, scrivimi per via privata o usa la bacheca visitatori nel mio profilo, così per dubbi di questo tipo si lascia il forum pulito ;-)

D'accordo