Ipad Safari - Hintergrundfarbe wird abgeschnitten

[Nikita]

Hallo liebe Community,,

ich habe folgendes Probelm bei einer Webseite.
Die Webseite beinhaltet mehrere Elemente die jeweils eine andere Hintergrundfarbe haben.
eigentlich ist die Seite genauso angelegt, dass auch auf dem Ipad im Safari die Farbe die komplette breite einnimmt..
Doch irgendwie funktioniert das auf manchen Seiten nicht und mittlerweile bin ich nur noch ratlos..
Denn auf den Seiten wo es funktioniert sind genau dieselben Elemente mit den gleichen Eigenschaften enthalten.

Im Anhang mal ein Screenshoot vom Ipad damit ihr seht was ich meine.



vill kennt ja jemand von euch dieses Problem und weiß es zu beheben?
Würde mich über eure Antworten sehr freuen.

Liebe Grüße

Niki

 

[Trüffelkrieger]

Tja ... was soll man da jetzt an Hand des Screenshots sagen?

 

[Nikita]

also der code zu einem Element dazu sieht wie folgt aus:

<div style="background-color:#fcf7ee" class="bg ueberschriften searchresult">
      <div style="background-color:#fcf7ee" class="inner">
          <h1>Ergebnis_der_Anfrage: unfall</h1>
          <h2>Seite: 1 von 1</h2>
     </div>
</div>

und die CSS:

.bg {
    width: 100%;


}
.ueberschriften .inner {
    padding-bottom: 72px;


}


.inner {
    margin: 0 auto;
    padding: 0 64px 64px;
    width: 1024px;


}
h1 {
    font-family: 'Open Sans',sans-serif;
    font-size: 48px;
    font-weight: 300;
    line-height: 52px;
    margin: 0;
    padding: 0;


}
h2 {
    font-family: 'Open Sans',sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 34px;
    margin: 0;
    padding: 0;


}

 

[soulxheart]

also der code zu einem Element dazu sieht wie folgt aus:

<div style="background-color:#fcf7ee" class="bg ueberschriften searchresult">
      <div style="background-color:#fcf7ee" class="inner">
          <h1>Ergebnis_der_Anfrage: unfall</h1>
          <h2>Seite: 1 von 1</h2>
     </div>
</div>

und die CSS:

.bg {
    width: 100%;


}
.ueberschriften .inner {
    padding-bottom: 72px;


}


.inner {
    margin: 0 auto;
    padding: 0 64px 64px;
    width: 1024px;


}
h1 {
    font-family: 'Open Sans',sans-serif;
    font-size: 48px;
    font-weight: 300;
    line-height: 52px;
    margin: 0;
    padding: 0;


}
h2 {
    font-family: 'Open Sans',sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 34px;
    margin: 0;
    padding: 0;


}

Hallo Nikita

Du gibst der Klasse inner eine feste Breite von 1024px - vielleicht da ansetzen?



Grüsse

 

[Nikita]

ja muss ich ja auch, damit der Inhalt diese weite nicht überschreitet. deswegen hat das div.bg darüber ja die weite von 100% und dieselbe Hintergrundfarbe, damit eigentlich genau das Problem nicht auftritt :/