18.11.2021, 00:29
|
|||
|
|||
Bild mittig platzieren
Guten Abend,
ich versuche seit über einer Stunde meine Bilder innerhalb der Divs mittig zu platzieren, und bekomme es einfach nicht hin. Momentan versuche ich mich an Baumhaus 1 auf dieser Seite: https://www.wipfelglueck.de/nBaumhaus.php Es scheint mittig platziert zu sein, aber wenn ich mir in der Konsole das CSS anschaue, und z.B. von Klasse "Normal" zur Klasse "HousePic" springe, dann passt da etwas nicht. Und so möchte ich das auf keinen Fall stehen lassen. Stimmt da etwas mit der Vererbung der Parameter nicht? Spreche ich die Elemente falsch an? Vielen Dank für Eure Hilfe! Gruß Stefan 
|
| Sponsored Links |
|
18.11.2021, 09:50
|
|||
|
|||
|
Leider nur fast. Es ist einfach nicht sauber programmiert, und das stört mich.
Mit diesem Code habe ich allerhand Varianten versucht: Code:
.HousePic
{
/* width: 90%; */
/* height: auto; */
/* float: top; */
/* align: center; */
/* padding: 40px ; */
/* margin: 40px; */
/* position: relative; */
}
.HousePic, img
{
width: 100%;
height: auto;
/* float: top; */
align: center;
padding: 40px ;
/* margin: 40px; */
position: relative;
}
|
|
18.11.2021, 11:39
|
|||
|
|||
|
Horizontal in dem Fall.
Die Überschrift steht z.B. mittig. Wenn ich mir mit der Konsole der Firefox die CSS anschaue dann passt das auch noch für das Div mit der Klasse "Normal". Wenn ich dann auf das Div mit der Klasse "HousePic" gehe sehe ich dass das nicht mehr mittig ist (auch wenn das Bild dann letztendlich horizontal wieder in der Mitte zu sein scheint). Verstehst Du was ich meine mit der Konsole? Die zeigt doch immer schön wenn ich im DOM das Div anwähle wie das Div im Browser dargestellt wird, mit allen Margin und Padding etc.
|
|
18.11.2021, 12:17
|
|||
|
|||
|
Zitat:
Ist das beabsichtigt? Davor verpasst du durch Code:
.SinglePic, img
{
width: 40%;
height: auto;
float: right;
padding: 30px;
}
(Ach ja, "float: top" und "align: center" gibt es nicht. Für letzteres kannst du eventuell "text-align:" nutzen.)
|
|
18.11.2021, 22:00
|
|||
|
|||
|
Vielen Dank erst mal für die Hinweise!
Das war so nicht beabsichtigt. Wenn ich das Komma weg lasse, dann spreche ich nur das img innerhalb der jeweiligen Klasse an? Ich hab es jetzt mit diesem Code so gemacht dass es passt: Code:
<div class="HousePic"><a href='/nBarrierefreiesBaumhaus1.php'><img width="600" height="300" src="/media/Platzhalter.webp" alt="Bad in unserem barrierefreien Baumhaus" /></a></div> Code:
.HousePic img
{
width: 100%;
height: auto;
position: relative;
}
|
|
19.11.2021, 12:16
|
|||
|
|||
|
Gerne doch.
Ganz nebenbei würde ich dir empfehlen deine Seite gelegentlich in den Validator zu schmeißen. HTML: https://validator.w3.org CSS: https://jigsaw.w3.org/css-validator/
|
 |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| bild per css mittig setzen | irmen | CSS | 4 | 25.08.2014 12:38 |
| Bild mittig ausrichten | heohni | CSS | 2 | 05.03.2012 15:19 |
| Bild innerhalb eines Textfeldes platzieren | thomas78 | (X)HTML | 13 | 17.12.2009 19:56 |
| Text mittig neben Bild ausrichten | prm | CSS | 5 | 10.02.2007 11:19 |
| Bild im Container mittig positionieren... | 18inch | CSS | 5 | 09.07.2005 15:48 |
Linear-Darstellung
