zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Bilder bzw. Text werden bei a:hover 'falsch' verschoben.

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 25.07.2009, 21:17
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.07.2009
Beiträge: 2
vinny befindet sich auf einem aufstrebenden Ast
Unglücklich Bilder bzw. Text werden bei a:hover 'falsch' verschoben.

Hallo,
ich bin ganz neu hier und habe auch nur wenig Ahnung von CSS und muss deswegen immer wild rumprobieren aber folgendes Problem konnte ich einfach nicht lösen:

Ich habe 5 Links auf der Startseite eingefügt. Immer wenn ich mit der Maus über einen der Links fahre (a:hover), erscheint am rechten Rand jeweils ein anderes Foto. Nur mit "display:block;Position:relative;" habe ich es geschafft, dass die Bilder an der richtigen Stelle angezeigt werden, egal ob ich das Browserfenster vergrößere oder verkleinere... .

Das Problem daran ist, dass dabei aber auch alle folgenden Links an den unteren Bildrand verschoben werden und sie so kaum noch zu erreichen sind, mal vom Aussehen abgesehen. Die Varianten display & position anders zu konfigurieren, hat immer dazu geführt, dass die Bilder dann beim vergrößern/verkleinern des Browsers falsch platziert wurden.

Das ganze kann man sich hier anschauen: Villetta Pelikan - Portal die CSS-Datei ist die http://villetta-pelikan.de/styles/portal.css

Ich hoffe mir kann jemand helfen.
Schon mal Danke
Vinny
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 25.07.2009, 22:21
Benutzerbild von plastiko
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 26.12.2007
Ort: Hannover
Beiträge: 945
plastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblick
Standard

Zitat:
Zitat von vinny Beitrag anzeigen
...Nur mit "display:block;Position:relative;" habe ich es geschafft, dass die Bilder an der richtigen Stelle angezeigt werden, egal ob ich das Browserfenster vergrößere oder verkleinere... .
Die Position ist so aber von der Schriftgröße abhängig.
Gebe #contentwrap #mitte #navbutton .default img besser position: absolute;
und dem Container #mitte #dreiviertelfenster position: relative;
__________________
MfG
Jens
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 04.08.2009, 00:22
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.07.2009
Beiträge: 2
vinny befindet sich auf einem aufstrebenden Ast
Standard ...Perfekt!!! - hat geklappt.

Hallo plastiko

das ist ja super - so hat's bestens geklappt! Leider verstehe ich gar nicht warum. Ich hätte es fürs nächste mal gerne auch nachvollzogen...Aber auf jeden Fall tausend Dank, für den kompakten Tipp und die superschnelle Antwort!!!

PS: Sorry für meine verspätete Antwort-ich war einige Zeit weg...

vinny
Mit Zitat antworten
  #4 (permalink)  
Alt 04.08.2009, 01:20
Benutzerbild von plastiko
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 26.12.2007
Ort: Hannover
Beiträge: 945
plastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblick
Standard

Schau mal hier:
Cascading Style Sheets { Vollreferenz zu CSS 1 und CSS 2.1 : POSITION }
__________________
MfG
Jens
Mit Zitat antworten
  #5 (permalink)  
Alt 21.10.2015, 07:32
Neuer Benutzer
neuer user
 
Registriert seit: 12.11.2014
Beiträge: 8
Earlenrico befindet sich auf einem aufstrebenden Ast
Standard

Hallo zusammen,

ich bin am Aufbau einer Steuerung.

Ich habe das Problem, wenn ich mit der Maus drüber wegfahren :hover bewegt sich das Bild bzw. auch der Text der unter dem Bild ist. Ich habe es in der CSS auch schon mit z-index, auch mit absolutosition probiert. Aber dann habe ich das Problem, wenn ich das Fester vom Browser kleiner mache bleibt das Bild aber nicht in der Mitte .Das möchte ich aber nicht. Vllt. könnt Ihr mir ja bitte helfen? Danke schon im voraus.

Ich möchte es am liebsten, dass wenn ich mit der Maus über die Steuerung fahre, dass das Bild und der Text fest verankert bleiben u. nicht verrutschen jedesmal
Vielen Dank für eure Hilfe schonmal im Voraus.

Gruß Enrico


HTML
<body>

<h1>Dart</h1>


<div id="steuerung">
<nav>
<ul>
<li><a href="index.html">Startseite</a></li>
<li><a href="#">Geschichte</a>
<li><a href="#">News</a>
<ul>
<li><a href="#">Angebote01</a></li>
<li><a href="#">Angebote02</a></li>
</ul>
</li>
<li><a href="#">Mannschaften</a></li>
</ul>
</nav>
</div>


<div id="bild" >
<img src="willkommen3.png" width="500" height="400" border="0" />
</div>




</body>



Cascading Style Sheet
h1{
color: #150185;
text-align: center;
}

nav ul ul {
display: none;

}

nav ul li:hover > ul {
display: block;
}



#bild{

background-position: center;

}

#steuerung, #steuerung a {
color: #A5685B;
font-size: 20px;
}

Geändert von Earlenrico (21.10.2015 um 11:48 Uhr)
Mit Zitat antworten
Antwort

Stichwörter
bilder, bilder galerie, bildergalerie, hover, relative, verschieben layout!, verschiebung, verschoben

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
Float:right fehler im IE6 gertnaster CSS 9 04.01.2011 22:59
Auf-/Zuklappen mit JS crimi Javascript & Ajax 7 23.09.2008 17:27
Falsche Darstellung beim Internet Explorer LordAvalon CSS 4 09.04.2007 17:22
#box a:hover .info: css-layout: ie6.0/win, moz.1ie5.0/mac, marioN CSS 2 19.01.2004 18:17


Alle Zeitangaben in WEZ +2. Es ist jetzt 00:04 Uhr.