Logo im Header

[schaufi]

Hallo Leute,

stehe im Moment vor folgendem Problem. Im Browser wird der Header korrekt angezeigt, jedoch am Handy stimmt die Proportion des Headers zum Headerbild nicht:



Besteht das Problem, da ich die Grafik einfach beim Pfad für das Logo eingefügt habe?
Wenn ja wie kann ich sonst die Headergrafik einfügen?

 

[McAtze]

Die Grafik wird zu groß sein und auf dem Handy wird sie dann proportional verkleinert ..

 

[schaufi]

Die Grafik wird zu groß sein und auf dem Handy wird sie dann proportional verkleinert ..

Kann man es vom Code nicht ändern das sich der Header Block proportional dem Headerbild anpasst?

 

[schaufi]

Ich denke die Änderung muss ich im header.css machen aber was genau ??

#header
{
   @property "header";
   color: rgb(255, 255, 255);
   background: rgb(51, 51, 44) url('@imagePath/xenforo/gradients/banner.jpg') repeat-x center top;
   @property "/header";
}

{xen:helper clearfix, '#header .pageWidth .pageContent'}

   #logo
   {
     display: block;
     float: left;
     line-height: {xen:calc '@headerLogoHeight - 4'}px;
     *line-height: @headerLogoHeight;
     height: @headerLogoHeight;
     max-width: 100%;
     vertical-align: middle;
   }

     /* IE6/7 vertical align fix */
     #logo span
     {
       *display: inline-block;
       *height: 100%;
     }

     #logo a:hover
     {
       text-decoration: none;
     }

     #logo img
     {
       vertical-align: middle;
       max-width: 100%;
     }

   #visitorInfo
   {
     float: right;
     min-width: 250px;
     _width: 250px;
     overflow: hidden; zoom: 1;
     background: @primaryLighter;
     padding: 5px;
     border-radius: 5px;
     margin: 10px 0;
     border: 1px solid @primaryDarker;
     color: @primaryDarker;
   }

     #visitorInfo .avatar
     {
       float: left;
       display: block;
     }

       #visitorInfo .avatar .img
       {
         border-color: @primaryLightish;
       }

     #visitorInfo .username
     {
       font-size: 18px;
       text-shadow: 1px 1px 10px white;
       color: @primaryDarker;
       white-space: nowrap;
       word-wrap: normal;
     }

     #alerts
     {
       zoom: 1;
     }

     #alerts #alertMessages
     {
       padding-left: 5px;
     }

     #alerts li.alertItem
     {
       font-size: 11px;
     }

       #alerts .label
       {
         color: @primaryDarker;
       }

 

[McAtze]

Du müsstes ein kleineres Logo für den Responsive Designe hochladen.

 

[principia]

http://xenforo.com/community/resources/responsive-design.2193/
http://xenforo.com/community/resources/responsive-adsense.2084/

 

[schaufi]

Hallo principia,

danke für die Links, dass Addon Respollo war die Lösung:
http://xenforo.com/community/resources/respollo.2016/