Page Padding + Header

Homepage Community Forums Epik Theme Support Page Padding + Header

  • This topic has 2 replies, 2 voices, and was last updated 7 years ago by Wes.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #21370
    Karl Baker
    Customer

      I’m having an issue with padding on my pages. I can’t seem to make page content full width. Instead the content sits with a border that runs around it similar to a blog post.

      Additionally I’d like to use my logo in the header however I’m unable to have the logo sit in the same line as the navigation menu. Instead the line drops below the logo.

      Any help on either of the two would be greatly appreciated!

      #21371
      Karl Baker
      Customer
        This reply has been marked as private.
        #21373
        Wes
        Moderator

          It looks like you’re already using the full width template, so the text can only reach as far as the content section will allow it to. Since it appears you’re using an older version of the theme, the width is set to around 1140px width.

          The “border” you’re seeing is the box-shadow. This can be changed or removed from the style.css –

          .entry {
              box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
              -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
              -webkit-box-shadow: 0 3px 6px rgba(0,0,0, .2);
              background: #fff;
              margin: 0 3px 40px;
              padding: 40px 0 0;
          }

          I can see some other .entry parts in your code when I inspect it, but I can’t tell where this code is coming from since you’re using a plugin to minify your CSS. Here’s what is showing up twice –

          .entry {
              padding: 40px 30px 30px 30px!important;
          }

          That’s what is controlling your padding at the moment.

          If you take a look at the new version, you can see that the background for content areas are all white now, and the content section is a little wider. Here’s an example of what that looks like – http://demo.appfinite.net/epik/layouts/fwc/

          Your Nav section shows up under the logo because your menu is too long. Your logo/title-area is already 570px width, and your Nav/Menu is currently 985px width. If you add both of those together, they both exceed the 1140px width limit. In any site that uses HTML, if you have 2 divs that can’t fit inside the same main div, then one of them will have to fall off to the side or under the other div. So in order for that to work, you’ll need to remove some menu items until both the logo and nav/menu will fit inside the 1140px area.

          Before you do that, you’ll need to remove the code you added that removes/overrides the float: right; for the .site-header .widget-area, Here’s what you added –

          .site-header .widget-area {
              float: none!important;
          }

          That’s preventing the nav from floating to the right.

          The latest version of Epik will give you a bit more space, so if you wanted to upgrade you’ll be able to add maybe an extra menu item or 2. The upgrade is not a requirement or anything.

          Let me know if this helps.

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