Boxed style, responsive on 13 inch screen

This topic has 11 replies, 4 voices, and was last updated 8 years, 11 months ago ago by Eva Kemp

  • Avatar: BrokenDancer
    BrokenDancer
    Participant
    April 24, 2015 at 12:45

    Hi,

    I use a boxed style layout with your great theme.
    When I open the site in Safari on a Macbook 13 inch then the website is really too big, it fills the whole browser, I was hoping to get a more “boxed” style on smaller screens.
    Can I fix that somehow?

    Jan

    Please, contact administrator
    for this information.
    10 Answers
    Avatar: Brian Johnson
    Brian Johnson
    Member
    April 25, 2015 at 08:53

    Hello

    Please provide us with screenshot and clarify your request with information about what you exactly would like to achieve. I have tested your site layout in different browsers and it looks fine in different resolutions.

    With best regards
    Brian Johnson

    Avatar: BrokenDancer
    BrokenDancer
    Participant
    April 25, 2015 at 10:14

    Hi,

    this is a screenshot of how the site looks on a 13inch Macbook in Safari.
    https://dl.dropboxusercontent.com/u/3502821/macbook%2013inch.png
    On my iMac the site looks really nice in boxed style with a lot white left and right:
    https://dl.dropboxusercontent.com/u/3502821/iMac.png

    i know that this a much larger screen but I was hoping to get the same look on a smaller screen but I understand that that is not really possible I guess.
    The logo looks kinda blurred on a smaller screen by the way.

    Thank you.

    Avatar: Eva
    Eva Kemp
    Support staff
    April 27, 2015 at 09:09

    Hello,

    Sorry for a delay. Please try to use this code in custom.css file:

    @media screen and (min-width: 1200px) {
    .boxed .st-container, .main-header > .container {
      width: 1000px;
    }}

    Thank you.
    Regards,
    Eva Kemp.

    Avatar: BrokenDancer
    BrokenDancer
    Participant
    April 27, 2015 at 09:14

    Thank you, the main logo is still blurred, don’t know why that is? I uploaded it in large size.

    Avatar: Eva
    Eva Kemp
    Support staff
    April 27, 2015 at 12:26

    Hello,

    Sorry, but I don’t see any problems with logo. Could you please show a screenshot?

    Thank you.
    Regards,
    Eva Kemp.

    Avatar: BrokenDancer
    BrokenDancer
    Participant
    April 27, 2015 at 12:31
    Avatar: Jimbo
    Jimbo
    Participant
    April 27, 2015 at 12:39

    Brokendancer,

    Excuse me jumping on your topic again lol

    I have fullwidth so looks great on mobiles, tablets etc but on big screens it would be good to have it boxed.

    Eva or the team, is that possible for larger screens to be boxed?

    Avatar: Eva
    Eva Kemp
    Support staff
    April 27, 2015 at 16:34

    Hello @Jimbo,

    Please try to use this code:

    @media screen and (min-width: 1200px) {.st-container {
      width: 1000px;
      margin-left: 130px;
    }
    .main-header > .container, .container {width: 1000px;}}

    Regards,
    Eva Kemp.

    Avatar: BrokenDancer
    BrokenDancer
    Participant
    April 27, 2015 at 18:21

    Don’t know why, but my main logo and the logo in the fixed header look really bad…

    Main logo is: .jpg 500×95 72ppi

    Fixed header logois: .jpg 470×82 72ppi

    https://dl.dropboxusercontent.com/u/3502821/Schermafbeelding%202015-04-27%20om%2019.02.47.png

    https://dl.dropboxusercontent.com/u/3502821/Schermafbeelding%202015-04-27%20om%2019.02.51.png

    Jan

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Support staff
    April 28, 2015 at 14:07

    Hello @BrokenDancer,

    Your original image wp-content/uploads/2015/02/Outdoor-Design-Tuinmeubelen-fixed-header.jpg has low resolution. Please try to reupload it in higher resolution.

    Thank you.
    Regards,
    Eva Kemp.

  • Viewing 11 results - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.