A question regarding editing logo area? some help would be much appreciated :)

Front page Support Forums Kabuki Theme Support A question regarding editing logo area? some help would be much appreciated :)

Tagged: ,

This topic contains 4 replies, has 2 voices, and was last updated by  satori 4 years, 6 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #1296

    Khan20
    Participant

    Hi there,

    Firstly id like to really thank you for all the help and support you have provided so far.

    I just have one more query.

    Question) I want to change the size of the logo area so it will accommodate and properly display my rectangular logo which is 300 x 100. I tried changing this through the CSS by altering the code below, however it has not worked, do you have any advice?

    The code I changed in order to change the size of the logo box to accommodate my larger logo size is below;

    #logo {
    width: 116px;
    height: 148px;
    float: left;
    }

    #logo-wrap #logo a {
    line-height: 0px;
    font-size: 0px;
    width: 116px;
    height: 120px;
    display: block;
    background-color: #000000;

    Where it says “width in both areas I changed it to 300px and then saved changes but nothing changed when I go to see the site.

    The above code was the only code I could find that related to the logo and changing its dimensions

    Also I am having the same issue with editing the relevant code for moving the logo box to the far left of the screen. I edit it, but nothing changes.

    Look forward to your reply…..

    #1300

    satori
    Member

    Dear Khan,

    you’ve found the right piece of code to increase the width of the logo area, not sure why it did not work. Please try adding this code at the bottom of “style.css”:

    #logo-wrap #logo a { width: 300px !important; }

    This will increase the length of the logo, yet it will overlap the content area on pages with content. We thus need some more CSS to make it work:

    #logo-wrap, #nav-primary { left: -314px !important; }

    Moving the logo to the leftmost part of the page would be trickier, since we would have to make more serious changes to the template files, but if you definitely need it that way, let me know, we’ll figure something out.

    Best,
    Andrew | Satori Studio

    #1306

    Khan20
    Participant

    Thankyou ever so much,

    I was able to move the logo area and change the size of the logo area using the code you provided above.

    I just have one final issue, that seems to be bugging me; and its related to the above and more specifically about the way the site looks on different screens.

    Is there a way of making it so the logo area is always along the far left side of the screen regardless of what screen resolution you are viewing the site from?

    For example your Kabuki demo theme: when viewing it using a 10 inch netbook screen it appears across the far left handside. However when viewing it using a 15 inch notebook screen it appears away from the far left and obscures some of the slider image.

    Is there a way of displaying the logo area and menu across the far left (as it appears on the 10 inch netbook screen) but for all displays?

    Look forward to your reply on this,

    #1307

    Khan20
    Participant

    In addition the above message, I see what you mean now about how lengthening the logo interferes with the content on the inner pages.

    If there is a solution that allows me to keep the logo at that length and not let it intefier with the inner pages, and that allows the logo area to remain static on the left side of the page regardless of screen resolution then that would be extremely helpful.

    Look forward to your reply.

    #1311

    satori
    Member

    Dear Khan,

    this is a rather complex issue, but let’s have a shot. Please try this CSS:

    @media only screen and (min-width: 990px) {
    #header #logo-wrap { position: absolute !important; left: 20px !important; float: none !important; }
    #nav-primary { position: absolute !important; left: 20px !important; top: 148px !important; }
    }

    Best,
    Andrew | Satori Studio

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.