zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Nach Anzeige eines Hintergrundbildes verschieben sich die Textpositionen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 12.03.2015, 22:33
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 12.03.2015
Beiträge: 9
sunshineh befindet sich auf einem aufstrebenden Ast
Standard Nach Anzeige eines Hintergrundbildes verschieben sich die Textpositionen

Hi,

ich nutze auf meiner Webseite ein fertiges Theme und passe die custom.css Datei so an, dass neben dem Logo einen Textstring steht.
Die Anpassung meinerseits sieht wie folgt aus

Code:
.logo img { 
    width: 40px; 
    height: 30px; 
    top: 14px; 
} 

.logo, .logo a { 
    width: 100%; 
    overflow: visible; 
} 

#top .logo-title { 
    position: absolute; 
    color: #666666; 
    left: 46px; 
    top: 0; 
}
Dies funktioniert soweit und ist passend platziert.

Nun möchte ich es noch so anpassen, dass wenn man mit der Maus über das Logo fährt, dieses ausgewechselt wird und der Textstring eine andere Farbe bekommt.
Dies funktioniert alleine mit dem Textstring sehr gut, nur wenn ich das Logo "austausche" indem ich das Bild ausblende und ein anderes an der Stelle im Background anzeige, passen die Positionen von Logo zum String nicht mehr und es verschiebt sich um den Offset des Logos

PHP-Code:
.logo:hover img 
    
opacity0


.
logo:hover 
    
background-imageurl(http://...//Logo_dgruen_56x40.png); 
    
background-size40px 30px
    
background-repeatno-repeat
    
top14px

Was muss ich ändern?
Ich wäre über eure Hilfe sehr dankbar, da ich schon lange erfolglos nach der "trail and error"-Methode rumprobiere und ich wahrscheinlich nur den passenden Befehl nicht kenne
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 13.03.2015, 00:00
Benutzerbild von Thielo
Web Ninja
XHTMLforum-Kenner
 
Registriert seit: 17.09.2009
Ort: Stuttgart oder so
Beiträge: 3.372
Thielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein Lichtblick
Standard

Dir fehlt HTML. Denn ohne HTML kann nichts dargestellt werden.

Ja, wir brauchen den KOMPLETTEN CODE (mit allem), Keine ZIP, am besten einen Link.
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato...
All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege

www.richard-thiel.de | Müssen Websiten überall gleich ausschauen?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 13.03.2015, 00:30
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 12.03.2015
Beiträge: 9
sunshineh befindet sich auf einem aufstrebenden Ast
Standard

Schade, ich dachte es gibt vielleicht einen CSS Befehl, der das Hintergrundbild für die Textpositionierung "unsichtbar" machen kann.

Schade, den Link kann ich hier leider nicht posten...

Dennoch vielen Dank für deine Rückmeldung!
Mit Zitat antworten
  #4 (permalink)  
Alt 13.03.2015, 02:08
Benutzerbild von Thielo
Web Ninja
XHTMLforum-Kenner
 
Registriert seit: 17.09.2009
Ort: Stuttgart oder so
Beiträge: 3.372
Thielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein Lichtblick
Standard

Können und wollen ist ein Unterschied. Und ein Hintergrundbild beeinflusst niemals eine Textpositionierung.
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato...
All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege

www.richard-thiel.de | Müssen Websiten überall gleich ausschauen?
Mit Zitat antworten
  #5 (permalink)  
Alt 13.03.2015, 11:08
Benutzerbild von etux
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 17.09.2007
Ort: Berlin
Beiträge: 643
etux wird schon bald berühmt werden
Standard

Zitat:
Zitat von sunshineh Beitrag anzeigen
Schade, den Link kann ich hier leider nicht posten...
Ja, schade. Denn den kompletten oder zumindest den relevanten Quellcode hättest Du schon posten können.
So kann ich eben nichts mehr als etwas Theorie beisteuern.

Mit „opacity“ kleiner 1 wird ein neuer Stapelkontext etabliert.
Womöglich kommt er im Konflikt mit dem Stapelkontext, von „.logo-title“.
Weitere mögliche Fehlerquellen: fehlende oder falsche Containing Blocks; Fehlende horizontale Offsets.

Wenn Du das Bild eh nur aus- und einblendest, arbeite lieber mit display: none | block.
Oder hole das Bild beim Hovern aus dem Sichtbereich raus: position absolute plus negativer Wert für left.
__________________
Grüße: Emil
--------------------------------------
https://emil-webdesign.net/
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Div nicht über Rand verschieben xxchucki Javascript & Ajax 1 18.05.2012 18:56
Background Anzeige im IE8 Hungerturm CSS 5 20.04.2009 20:25
Tooltips verschieben Bilder Flouw CSS 5 26.03.2007 23:52
Probleme mit Top Navigator und Anzeige im Mozilla!?!?! Patrik CSS 2 24.08.2004 17:37


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:37 Uhr.