mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Di 16.04.2024 19:55 Benutzername: Passwort: Auto-Login

Thema: Problem mit div Container - höhe soll sich automatisch anpas vom 15.07.2013


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Problem mit div Container - höhe soll sich automatisch anpas
Autor Nachricht
magalan
Threadersteller

Dabei seit: 28.02.2013
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 15.07.2013 16:50
Titel

Problem mit div Container - höhe soll sich automatisch anpas

Antworten mit Zitat Zum Seitenanfang

Hallo,

Ich bin dabei mir ein Grundgerüst für eine Website aufzubauen.

Innerhalb meines wrappers (id=wrapper) habe ich einen div container (id=logo), welcher ein jpg enthält.
Ich hätte gerne, dass das jpg (logo) automatisch die Höhe des Containers anpasst. Ich habe also keine Angabe für die Höhe gemacht. Aber warum wird der Container höher als das Bild ?

Im Firefox sind es 4 pixel und im Chrome 3 pixel.

Kann mir Jemand sagen wo das Problem liegt ?

Hier der Link zur Seite:

http://www.pixelschubser.be/responsive/

und der Quellcode:

Code:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<meta name="robots" content="noindex, nofollow" />
<title>RWD</title>
<style type="text/css">

* {
   margin:0;
   padding:0;
   font-family:Arial, Helvetica, sans-serif;
   }

body {
   background-color:#009999;
   }

#wrapper {
   width:800px;
   margin-left:auto;
   margin-right:auto;
   background-color:#FFF;
   }

#logo {
   background-color:#CCC;
   }

#navigation {
   }
   
#content {
   background-color:#CCC;
   }

#footer {
   }

</style>
</head>
<body>
<div id="wrapper">
   <div id="logo"><img src="images/logo_250.jpg" alt="" width="250" height="100" /></div>
   <div id="navigation">navigation</div>
    <div id="content">content</div>
    <div id="footer">footer</div>
</div>
</body>
</html>


Zuletzt bearbeitet von magalan am Mo 15.07.2013 16:51, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
top
Moderator

Dabei seit: 25.11.2003
Ort: Hedwig Holzbein
Alter: 52
Geschlecht: Männlich
Verfasst Mo 15.07.2013 17:03
Titel

Antworten mit Zitat Zum Seitenanfang

Dein Logo-Bild wird wie ein Schriftzeichen behandelt. Als Vorgabewert werden Bilder an der Grundlinie ausgerichtet. Der Abstand nach unten entsteht also durch den Raum welcher für Unterlängen wie z. B. beim Buchstaben "g" oder "j" benötigt wird.

Ergänze mal deine CSS-Angaben hier mit:
Code:
#logo img {
   vertical-align: bottom;
   }
  View user's profile Private Nachricht senden
Anzeige
Anzeige
magalan
Threadersteller

Dabei seit: 28.02.2013
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 15.07.2013 17:37
Titel

Antworten mit Zitat Zum Seitenanfang

top hat geschrieben:
Dein Logo-Bild wird wie ein Schriftzeichen behandelt. Als Vorgabewert werden Bilder an der Grundlinie ausgerichtet. Der Abstand nach unten entsteht also durch den Raum welcher für Unterlängen wie z. B. beim Buchstaben "g" oder "j" benötigt wird.

Ergänze mal deine CSS-Angaben hier mit:
Code:
#logo img {
   vertical-align: bottom;
   }



Ah danke jetzt geht es, nur wie kann ich wissen das Bilder wie text gehandhabt werden ?

Wo findet man solche Infos ?
  View user's profile Private Nachricht senden
Morgo

Dabei seit: 10.08.2005
Ort: Von Kowelenz bis Kölle
Alter: 39
Geschlecht: Männlich
Verfasst Mo 15.07.2013 18:11
Titel

Antworten mit Zitat Zum Seitenanfang

Such mal nach „CSS Boxmodell” und dem Unterschied zwischen Block- und Inline-Elementen.
  View user's profile Private Nachricht senden
magalan
Threadersteller

Dabei seit: 28.02.2013
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 15.07.2013 18:32
Titel

Antworten mit Zitat Zum Seitenanfang

Morgo hat geschrieben:
Such mal nach „CSS Boxmodell” und dem Unterschied zwischen Block- und Inline-Elementen.



Ah ok, ich hätte also, wie ich grade sehe, auch einfach das img in ein Block Element konvertieren können.


Code:

#logo img {
     display:block;
   }


Danke euch für die schnelle Hilfe


Zuletzt bearbeitet von magalan am Mo 15.07.2013 18:33, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen CSS Problem. Div Container sollen sich automatisch anpassen.
css div container höhe?
[css] div-container Höhe
[CSS/HTML Probs] Container und 100% Höhe
3 Divs nebeneinander im Container auf einer Höhe?
Container Problem
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.