Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • October 13, 2014 at 7:10 pm #335122
    wienerpresswerk

    Hi there,

    i´ve tried to make the logo fullwidth to fit the border left to border left while keeping it responsive.
    my logo for now 1420*234px.

    as found in other topic i´ve added 

    #top .logo, #top .logo a {
display: block;
height: 234px;
width: 100%;
position: absolute;
}

    to quick css

    any idea to realize that?

    thx and best regards.

    October 13, 2014 at 7:24 pm #335130
    Yigit

    Hi wienerpresswerk!

    Please add following code to Quick CSS

    div#header_main .container { margin: 0; padding: 0; max-width: 100%; }
.logo img { width: 100%; }

    Cheers!
    Yigit

    October 14, 2014 at 3:01 pm #335590
    wienerpresswerk

    thx for your outstanding support!

    It works for desktop view but now i face some trouble below aprox. 767 px.

    I would never use a full frame logo but have to find the solution for the customer.

    it may be a solution to provide a different logo only for mobiles but no idea to implement that.

    thx for your advice!

    October 14, 2014 at 3:05 pm #335594
    Yigit

    Hi!

    Please add following code to Quick CSS as well and adjust as needed

    @media only screen and (max-width: 768px) {
.logo img { opacity: 0; }
.logo a { background-image: url(https://kriesi.at/wp-content/themes/kriesi/images/logo.png); background-size: contain; background-repeat: no-repeat; background-position: 50% 50%; }}

    Regards,
    Yigit

    October 14, 2014 at 6:34 pm #335701
    wienerpresswerk

    Thx Yigit,

    outstanding as ever ;-)

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Logo full width’ is closed to new replies.