Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • July 30, 2014 at 12:29 pm #297663
    WalstonNet

    Is there a way to increase the width of the body content area so that everything is a certain percentage? I have everything set to full width, but the body area isn’t displaying it anywhere near full.

    Thank you.

    Screenshot

    July 30, 2014 at 12:51 pm #297681
    WalstonNet

    I was able to get the body width changed but only for the header & footer portions with this quick css, but the body container was not affected. So now I just need help with that portion. And I set the width, as you can see, to 1920. Is that a correct width to use if I want it at 100% for any size resolution display, or on smaller resolutions will 1920 make it scroll horizontally? Thank you!!!

    .responsive .container {
    width: 1920px;
  }

    Screenshot

    July 31, 2014 at 2:57 am #298052
    Ismael

    Hi!

    Thank you for using the theme.

    No, 1920px is not the correct width across all screen resolution. The theme is using 1210px which is a standard width for screen resolution more than 1340px. You need to use media queries if you want to change the width of the body container for different screen sizes. This is the default container width:

    @media only screen and (min-width: 1340px) {
.responsive_large .container {
width: 1210px;
}
}

@media only screen and (min-width: 1140px) {
.responsive .container {
width: 1030px;
}
}

.container {
width: 910px;
}

@media only screen and (max-width: 767px) {
.responsive .container {
width: 268px;
margin: 0 auto;
}
}

@media only screen and (max-width: 767px) and (min-width: 480px) {
.responsive .container {
width: 428px;
margin: 0 auto;
}
}

    You can adjust the width.

    Best regards,
    Ismael

    July 31, 2014 at 7:17 am #298120
    WalstonNet

    Ok so that worked, but now the text is back to the smaller width & now it is not centered, which is strange. Isn’t there a way I can use percentage instead of a fixed pixel width? Just for the heck of it I did try:

    .container {
width: 100%;
}

    But that didn’t change anything so maybe not?

    If I change it from 1210 to any number higher, it stays the same. How would I go about making it like say 90% centered so there would be a good padding left & right? This is close to the last thing I am working on, which of course means it is driving me crazy, LOL!

    There’s got to be a way to accomplish it because I have seen it done on so many other sites using this theme.

    Screenshot

    Thank you!

    July 31, 2014 at 7:28 am #298122
    Devin

    Hey!

    No, not easily. The grid for the theme uses fixed widths for different breakpoints but its based on a .less file to calculate all the sizes so if you wanted to dive into generating your own grid you could.

    The grid.less is in the css folder and you can read more about less preprocessing here: http://lesscss.org/

    Cheers!
    Devin

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