Issue while resizing when content has image

  • Resolved Ashutosh

    (@ashubetta)


    12 years, 6 months ago

    Hi Ron,
    I found this minor bug while resizing the window in Firefox and Internet Explorer:
    Animation, Screenshot

    Basically, when either the content or the sidebar (or both) have a full width image, they won’t resize fluidly when the browser window is being resized. Here’s a page without any image in the content or sidebar:

    Animation

    Chrome (and I presume other WebKit/Blink browsers as well) doesn’t have this problem. Does this have anything to do with “display:table-cell” that you suggested here? I tried Asteroid and it seems to have the same problem.

    The screenshots are from my local WP installation, but my blog is running the same code.

    Thanks.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Theme Author ronangelo

    (@ronangelo)

    12 years, 6 months ago

    Yes, that is caused by the display: table-cell
    Elements that behave like tables follow the size of its content. Can’t find a good solution to this since even the browsers can’t seem to agree on how to display these styles similarly. To make this work you’ll have to use percentages for the widths instead of exact pixels.

    Remove the added css code from your last topic then add this on the Custom CSS option:

    #main #content {width: 66.5%;}
#main .sidebar {width: 33.5%;}

@media screen and (max-width:800px){
   #main #content, #main .sidebar {width: 100%;}
}
    Thread Starter Ashutosh

    (@ashubetta)

    12 years, 6 months ago

    This works much better. Thanks a lot. 🙂

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

The topic ‘Issue while resizing when content has image’ is closed to new replies.