Thread

Please see attached screen shot

This happens only in a few browsers (AOL but not only) and not consistently across systems, screen resolutions… So it’s hard to isolate. I assume it’s the CSS for the sidebar and the content but I don’t see anything specifically for position so i am wondering

Thanks
-Stuart

I checked in netrender and I found that is limited to IE7

Thanks

im guessing those two blocks should not be on top of your banner? try putting <br [removed] > just below your banner.

if that doesnt work pls post your relevant html and css, and a screenshot of what it should look like, eg in FF. floats are easy, once you get to know them 😊

Because it happens with two different templates I am assuming it’s in the style sheet.

One template: http://nyimc.pmhclients.com/
Another template: http://nyimc.pmhclients.com/index.php/site/sitting_Brooklyn/

You can see from these pages how they look when they display ok

The CSS is at http://nyimc.pmhclients.com/index.php/site/site_css

Thanks

if it was the problem i suggested then yes, its a css thing but you can test it out by inserting that break tag with float property. if that fixes it, you go to your css file and clear whatever was making the problem.

however, it seems you have an image tag thats not closed - add “>”

<pre><code>
<img src=”/nyisys/images/quote2.gif” width=“160” height=“170”

THanks, the break tag should do it. I still haven’t quite fixed it - there’s way too many blocks - but you’ve pointed the way and I should be able to take it from here

Thanks so much

clearing floats can be confusing. google “floatutorial”, i find that the best one around. and always validate your html & css to find silly errors.

good luck

Arghh No clearing the float doesn’t do it. The problem is the VERTICAL placement of the heading and the content, which in IE7 overlaps the head

The problem must be in the code below somewhere. Or in the CSS - http://nyimc.pmhclients.com/index.php/site/site_css

Help would be appreciated

note: the embedded menus template has one table in it. No divs, no anything but a table with the menus and the header graphic

- - - - -
<div id=“wrapper”>

<div id=“blog-header”>
<div id=“blog-header-text”>
{embed="site/menus"}
</div>

<br class=“clear” >

</div>
<div id=“content-wrapper”>

<div id=“content”>

<! - - -CONTENT——- - —LIMIT TO ONE DISPLAY - - - - - ->
<div class=“post”>
<div class=“post-summary”>
<h1>Brooklyn Family Sangha</h1>
</div></div>
{exp:weblog:entries weblog="{my_weblog}” orderby=“order_listed” sort=“desc” limit=“10”}

<! -—- - - - -—- —BLOG POSTS——- - - - - - - - - - - - - - - ->
<div class=“post”>
<div class=“post-summary”>

{groupname}

{sitttinggrouptime}
{coursefee}
{groupdescription}
</div></div>
<!—end .post—>

{/exp:weblog:entries}

</div>

<div id=“sidebar”>
/nyisys/images/brooklynbridge.jpg

/nyisys/images/quote2.gif

<br class=“clear” >

<div class=“sidebar-block about”>

</div>

<div class=“sidebar-block”>

<h3 class=“sidebar-header”>Search</h3>

{exp:search:simple_form search_in="everywhere"}

<input type=“text” name=“keywords” value=”” class=“input” size=“18” maxlength=“100” />

<input type=“submit” value=“submit”  class=“submit” /></p>

Advanced Search

{/exp:search:simple_form}

</div>

  </div>
  </div>

  <div class=“clear”></div>

</div>
<!—close #content-wrapper—>

I just checked it out and it seems to work for me in IE7 on Vista on a 1680x1050 monitor.

But your footer (#blog-footer) is not floated and uses a weird amount of space (just look where your top border ends up) which may trip up IE7.
Also try to use the position is everything clearfix:

/* <a href="http://www.positioniseverything.net/easyclearing.html">http://www.positioniseverything.net/easyclearing.html</a> */
.clearfix:after
{
    clear: both;
    content: '.';
    display: block;
    visibility: hidden;
    height: 0;
}
.clearfix
{
    display: inline-block;
}
* html .clearfix
{
    height: 1%;
}
.clearfix
{
    display: block;
}

that display:inline-block did wonders for me. If that still doesn’t work try to add:

display: inline;     /* might fix IE bug */

to all floated containers that have the overlap problem. IE seems to have some issues with bottom margins and padding for boxes within a float. The additional inline thingy may solve it.

nice css snippet, thanks