Hallo allerseits 
Ich benötige eure Hilfe.
Auf meiner Webseite habe ich Joomla 3.6.2 installiert.
So weit so gut nur das in der Mobilen Ansicht mein Titelbild
abgeschnitten ist, je nach dem welches Handy man verwendet.
Bei einem Samsung Galaxy S4 zum Beispiel zeigt er das Titelbild komplett an,
aber wenn ich mit meinem Iphone 6 Plus die Seite anschaue, fehlt beim rechten Rand
einige Zentimeter.
Ich würde mich freuen wenn ihr mir weiter helfen könnt 
Hi,
ohne Link zur Seite oder zum Template wird's schwierig.
Das iPhone hat eine Viewport Breite von 414px.
Du könntest in der media.css
aus
Zitat/* Landscape phones and down */
@media (max-width: 400px)
Zitat
machen.
viiiiielen Dank 
das war ja schon alles und ich hab stunden lang dran gesessen 
Da war ich wohl zu schnell, ich hab da doch noch eine Frage 
Habe schon in der media.css rum experimentiert aber ohne erfolg.
Und zwar ist unter dem Bild mit der Frau ein leerer schwarzer Bereich der mich noch stört.
Ich hätte gern das Bild komplett ausgefüllt.
(Links und rechts neben dem Bild ist auch ein kleiner schwarzer Bereich bei der Ansicht vom Iphone 6 Plus)
Muss noch dazu erwähnen das ich die Ansicht: Portrait (Handy vertikal gehalten) gemeint ist.
@media (max-width: 414px)
{
.series-container
{
height: 425px;
margin: 0;
}
HEADER.header
{
background-size: cover;
background-position: 0px 89px;
}
}
Im Chrome oder Firefox STRG+UMSCHALT+M kannst du die verschiedenen Geräte/Viewports prima simulieren und das CSS passend machen.
OK super Danke für den Tipp mit dem simulieren über die jeweiligen Browser, das ist echt hilfreich
Habe deinen rat befolgt und stehe jetzt vor einem neuen Rätsel wo ich nicht weiterkomme.
Wenn ich die Seite jetzt auf meinem Handy anschaue, sieht das Titelbild so aus wie es sein soll.
Nur wenn ich jetzt z.B. auf http://www.responsive.cc/ das Design Prüfe sieht es dort noch so aus wie am Anfang 
Wie bekomme ich das hin das es auf den meisten Handy passend aussieht?
Habe noch ein altes Galaxy S4 und Iphone 5, dort hat sich noch nichts geändert.
Muss ich dann in der media.css die jeweiligen Handygrößen hinzufügen?
Muss ich dann in der media.css die jeweiligen Handygrößen hinzufügen?
Ja. Oder du passt die vorhanden an.
Bisher hast du ja
@media (max-width: 414px)Das heißt, dass das was in der Querie steht nur angewendet wird, wenn die Breite des Bildschirms maximal 414 Pixel beträgt.
Wenn du das auf
@media (max-width: 500px)abänderst, wird es auch von den Geräten mit 415 Pixel bis 500 Pixel breite ausgelesen.
Weil sich die Displaybreiten dauernd ändern und es auch viele verschiedene gibt, finde ich, dass man nicht mehr auf spezielle Geräte optimieren sollte. Man sollte sich eher angucken, bis zu welcher Breite ein Design gut aussieht und erst dann etwas ändern. Wenn man für bestimmte Geräte optimiert wendet man adaptives Web-Design an. Das ist nicht responsive. Hier ist ein meiner Meinung nach guter Artikel dazu: http://t3n.de/news/responsive-…web-entwicklung-504906/2/
Zu Media Queries und was du damit machen kannst findest du hier die aktuelle Spezifikation des W3C: https://www.w3.org/TR/css3-mediaqueries/
Klasse wie schnell man hier Antworten bekommt die auch noch hilfreich sind.
werden mich die nächsten Tage dran setzen, vielen vielen Dank für die Tipps und Infos.
Ich muss leider nochmal nachfragen,
wenn ich dieses Bild auf meine Homepage (www.lx-pipes.de) einfüge
wird es auf der Handyansicht bzw. Mobilansicht nicht verkleinert.
finde nichts wo ich es ändern könnte 
Hallo,
probiers damit:
img {
max-width:100%;
height:auto;
}
"Callback-Serice" würde ich noch ausbessern
Liebe Grüße, Christine
Nach Deinem post:
ahhhhh wunderbar. Bearbeiten geht noch (post). Na ja, meinte damit: Service
sehr nice, funktioniert danke
was meinst du genau mit ausbessern ?
Wahrscheinlich(?) soll auch die
"1 PEIFE"
"1 PFEIFE" sein (auf dem roten Flyer/Banner).
wieder aaaaah. Na net nur.
"Einfach 2 Peifen" > "Einfach 2 Pfeifen". Das andere, was ich gemeint habe, ist im Edit oben.
oh man garnicht gesehen bei der Schriftart 
danke für die hinweise 
