How can I fix layout issues in graphene theme?

  • nidhi

    #6185

    I have some issues with layout like the left sidebar and my centre(main box) don’t seem to be linear.

    I also want to do some setting so that, whenever my main box extends downwards(when information on page is more), my sidebar should also extend at the similar height. Is that possible?

    Someone help me please…

    Mod

    Kenneth John Odle

    #33586
    Quote:
    I have some issues with layout like the left sidebar and my centre(main box) don’t seem to be linear.

    What do you mean by this?

    Quote:
    my sidebar should also extend at the similar height. Is that possible?

    Not with CSS. It is possible with JavaScript. There are a few examples of this on the Google; have a look around.

    nidhi

    #33587

    Hi Kenneth, Thanks for ur reply.

    I have some issues with layout like the left sidebar and my centre(main box) don’t seem to be linear.

    by above statement I mean that, the level of my sidebar and main area in website looks bit different. I want to make both of these things at the same level.

    can you give me some links for, It will be a great help for me:

    my sidebar should also extend at the similar height. Is that possible?

    Not with CSS. It is possible with JavaScript. There are a few examples of this on the Google; have a look around.

    Mod

    Kenneth John Odle

    #33588

    nidhi

    #33589

    Thanks Kenneth

    Prasanna SP

    #33590

    Add this to Custom CSS,

    .sidebar div.sidebar-wrap [
    margin-top: -2px;
    }

    nidhi

    #33591

    Thanks Prasanna, thanks for your help, I’ve tried this code, it fixes the problem of top margin, but if I add “margin-bottom: -2px” it still remains same. Heigh of the pages in my website is varying in every page, so I want to make the sidebar of same height of the page on every page. Is that possible?

    Thanks

    Prasanna SP

    #33592

    You may try changing widget background colour to match the container background,

    #dropdown-menu-2 {
    background: #E3E3E3;
    box-shadow: none;
    padding: 0 0 0 10px;
    }

    #sidebar2 {
    background: #E3E3E3;
    }

    .menu-item {
    background: #E3E3E3 !important;
    }

    .menu-item:hover, .menu-item a:hover {
    background: #FFFFFF !important;
    }

    This will look like this,

    xtfCK.png

    Just a constructive suggestion, to align the sidebar menu within the widget,

    #menu-itm_menu {
    margin: -12px;
    }

    Notice the difference,

    4CvxG.png

    nidhi

    #33593

    Wow,You are genius, I’ll apply your suggestions. Just wondering, How did you know about the menu names?

    Prasanna SP

    #33594
    Quote:
    Just wondering, How did you know about the menu names?

    Dig HTML source or use http://getfirebug.com/

Viewing 10 posts - 1 through 10 (of 13 total)

You must be logged in to reply to this topic.