# Bilder untereinander sollen aber nebeneinander



## Vera- (3. August 2010)

Hallo, 
ich habe bilder die bei mouseover größer werden.
Ich habe den Code von homepage-faqs.de, wo aber die Bilder untereinander angeordnet sind. Ich möchte aber gerne, dass die Bilder nebeneinander sind.

Hier der Code:

```
<html> 
<head> 
<title></title>
<style>
a.bild1 { display:block; background-image:url(../Bilder/bildklein.png); width:120px; height:100px }
a.bild1:hover { background-image:url(../Bilder/Bild1.jpg); width:600px; height:450px }
a.bild2 { display:block; background-image:url(../Bilder/bildklein2.png); width:120px; height:100px }
a.bild2:hover { background-image:url(../Bilder/Bild4.jpg); width:600px; height:450px }
a.bild3 { display:block; background-image:url(../Bilder/bildklein3.png); width:120px; height:100px }
a.bild3:hover { background-image:url(../Bilder/Bild5.jpg); width:600px; height:450px }
a.bild4 { display:block; background-image:url(../Bilder/bildklein4.png); width:120px; height:100px }
a.bild4:hover { background-image:url(../Bilder/Bild6.jpg); width:600px; height:450px }
</style>
</head>
<body>

<a class="bild1" href="#"></a> 
<a class="bild2" href="#"></a>  
<a class="bild3" href="#"></a> 
<a class="bild4" href="#"></a>

</body> 
</html>
```


----------



## Sven Mintel (3. August 2010)

Moin Vera,

da musst du nur folgendes:


```
display:block
```
...überall aus deinem Stylesheet entfernen.


----------



## Vera- (3. August 2010)

Habe ich schon versucht, aber dann werden die Bilder gar nicht mehr angezeigt


----------



## Sven Mintel (3. August 2010)

Ahso, sorry 

Erweitere dein Stylesheet überall da, wo *display:block* steht, noch um dies:


```
float:left;
```


----------



## Vera- (3. August 2010)

Dankeschön, hat geklappt 
Ich hab den Text zentriert, wo die Bilder drüber sollen aber irgendwie gehen die nicht mit in die Mitte?


----------



## Sven Mintel (3. August 2010)

Wie hast du den Text denn zentriert?


----------



## Vera- (3. August 2010)

mit
	
	
	



```
<p align="center">
```


----------



## Sven Mintel (4. August 2010)

Ok, dann nächster Versuch :suspekt:

Entferne im CSS dort, wo das display:block+float:left steht, diese beiden Angaben, und füge stattdessen:

```
display:inline-block;
```
...dort ein.

dem <p> gebe den Style 

```
text-align:center;
```


----------



## Vera- (4. August 2010)

Habs hinbekommen. Danke


----------

