Premium Theme Support › Themes Harbor › tdEditor

Trouble with Content and Header Width on Tablet View

  • Author
    Posts
  • #75251
    sourteaatmidnight
    Member

    Hi again…I swear this I am almost finished bugging you! :) I am having some trouble with the header and content width on my pages, not posts. Here is what is happening (please note that all of these situations apply to tablet view -specifically when held vertically):

    1. The content / text is not shrinking down to fit the screen size all of the way. In order to avoid scrolling left to right to read all of the content, I have to manually shrink the page using my fingers.

    2. When I shrink the page down manually, the header and navigation bar do not fill the page left to right. This looks a little awkward.

    Here is a link to view what I am talking about. I made some notes besides each image: https://plus.google.com/photos/109832310056712103165/albums/6143600502353225217?authkey=CJrZr5Cp2amVtwE

    At one point I adjusted my margins to the hentry and innerhentry, so I am guessing that this is all my fault. I am having this issue on the About Page, the Videos Page, and the Press Page. Here is the CSS that I applied to the About Page (this may be the culprit):

    .page-id-32 .hentry-inner {
    background-color: #ededed;
    margin-top: 40px;
    }

    .page-id-32 .hentry {
    background-color: #ededed;
    margin: 50px;
    }

    .page-id-32 .entry-content {
    background-color: #ffffff;
    margin: -100px;
    padding: 40px;
    float: left;
    }

    I added this CSS because I wanted a grey background but I wanted the content to be contained within a white box.

    Thank you again for all of your great support! I will be recommending this Theme for years to come!

    The blog I need help with is: (visible only to logged in users)

    #75367
    tarasdashkevych
    Theme Author

    Hello :)

    The reason why it happens is because the negative margins in this css:

    .page-id-32 .entry-content {
  background-color: #ffffff;
  margin: -100px;
  padding: 40px;
  float: left;
}

    Please try this css ( also, please remove previous css):

    .page-id-32 .entry-content {
  background-color: #ffffff;
  padding: 40px;
}

.page-id-32 .hentry .hentry-inner {
   max-width: 100%;
}
    #75377
    sourteaatmidnight
    Member
    Original poster

    Worked like a charm!!! Thank you so much! I have learned so much from you throughout this process. Now just to update the content and fully launch! :) Thank you again!

    #75383
    tarasdashkevych
    Theme Author

    Great :)
    You are welcome. I’m glad I was able to help :)

  • The topic ‘Trouble with Content and Header Width on Tablet View’ is closed to new replies.