My blog is moving!!

  • Got a problem here… Stuff on my blog is moving!

    Here’s the situation. With much blood, sweat, and tears, I created my own theme: https://www.jonathanbostrom.com. And it seems to be fine except for two annoying things.

    1. The header moves. When viewed in a significantly different resolution, the header image moves to the right. It also moves to the right when you open a toolbar on the side of the page (i.e. history). Can’t figure it out…

    2. The items in the footers under each post are constantly shifting. Sometimes the items are stacked one on top of eachother. Then they’re laid out in a more organized fashion. Then they scatter again. No idea what’s going on here!

    Does anyone have any idea how to fix these problems? I have reached the end of my rope.

    Thanks so much!

    Jonathan

    (Again, the website is: https://www.jonathanbostrom.com)

Viewing 8 replies - 1 through 8 (of 8 total)

  • You may have more blood, sweat, and tears coming…

    You’ve got validation problems.

    Invalid HTML can cause the sort of unpredictable irregularities you mention.

    Lots of those errors come from invalid img tags. They should always look like this:

    <img src="url to image" alt="describe image" />

    Note that alt attribute (it can be blank if you want, alt="") and the self-closing />

    you have a margin-left of 18.9% so the exact value in pixels will vary with resolutions.
    note, there is a standalone </form> tag in your header.

    Thread Starter jdbostrom

    (@jdbostrom)

    Thanks very much guys!

    Do you have a recommendation of how to best attack the problem? I am essentially illiterate when it comes to this stuff.

    When it comes to the margin-left of 18.9%, is the way fix that setting the margin for a fixed number of pixels?

    I’ll try figure out the whole validation issue…

    Thanks again!

    change 18.9% in auto this will center your header

    Thread Starter jdbostrom

    (@jdbostrom)

    Odd, I tried that, but it immediately moved the header to the left.

    Put your ‘header’ class/ID INSIDE your container. That way it will sit in the same location as the rest of the page.

    Until you fix the HTML validation errors, you can’t rely on CSS alone fixing these irregularities.

    Thread Starter jdbostrom

    (@jdbostrom)

    Thanks, let me see what I can do here…

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘My blog is moving!!’ is closed to new replies.