Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • February 28, 2014 at 6:50 pm #230732
    Thinkgate

    Hi, I am trying to ‘widen the navigation area’ to be able to fit more menu items. I know I can do this by adjusting the container or adjusting the Responsive Layout via Theme Options, but want to keep the body container width the same (1030px). If it is adjusted via the theme options, the entire site container is widened.

    Do you is there a way to do this via CSS? Or is it a javascript modification?

    Thanks!

    March 2, 2014 at 4:51 am #231187
    Ismael

    Hey murphy88!

    What type of header do you have? You can use this on Quick CSS or custom.css to increase the header width. In this code I increase it by a 100px:

    @media only screen and (min-width: 1140px) {
#header_main .container, #header_meta .container {
width: 1230px;
}
}

#header_main .container, #header_meta .container {
width: 1030px;
}

@media only screen and (max-width: 989px) and (min-width: 768px) {
#header_main .container, #header_meta .container {
width: 782px;
}
}

    Regards,
    Ismael

    March 3, 2014 at 5:36 pm #231671
    Thinkgate

    Small fixed header and responsive Layout (Max Width: 1030px).

    March 3, 2014 at 9:20 pm #231829
    Yigit

    Hey!

    You can add !important rule to Ismael’s code to force it as following 

    @media only screen and (min-width: 1140px) {
#header_main .container, #header_meta .container {
width: 1230px !important;
}
}

#header_main .container, #header_meta .container {
width: 1030px !important;
}

@media only screen and (max-width: 989px) and (min-width: 768px) {
#header_main .container, #header_meta .container {
width: 782px !important;
}
}

    You may need to make additional modifications. Please hire a freelance developer for further customization

    Regards,
    Yigit

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.