Problem with explorer to make 2 divs close to each other

HTML & CSS
1

I was having trouble on Explorer when I was trying to add 2 Div’s
next to each other…
one would be the up
and the second div would be under him… with no SPACE between both divs…

On Firefox it worked fine but on explorer I was seeing a line between…

CSS Code:

.borders{width:900px; height: 530px;}
.flashborder{width:900px; height: 302px;  }
.inputborder{background: url(LowerPart.png); width:900px; height:228px;  }

Main Page Code:

	<div class="borders">
	<!-- The flash border next: -->
		<div class="flashborder"><object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="900" height="302">
		  <param name="movie" value="Images/HighPart.swf">
		  <param name="quality" value="high">
		  <param name="wmode" value="opaque">
		  <param name="swfversion" value="6.0.65.0">
		  <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don&#8217;t want users to see the prompt. -->
		  <param name="expressinstall" value="Scripts/expressInstall.swf">
		  <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
		  <!--[if !IE]>-->
		  <object type="application/x-shockwave-flash" data="Images/HighPart.swf"  width="900" height="302">
		    <!--<![endif]-->
		    <param name="quality" value="high">
		    <param name="wmode" value="opaque">
		    <param name="swfversion" value="6.0.65.0">
		    <param name="expressinstall" value="Scripts/expressInstall.swf">
		    <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
		    <div>
		      <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
		      <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
	        </div>
		    <!--[if !IE]>-->
	      </object>
		  <!--<![endif]-->
      </object>
	  </div>
	  <!-- The Lower part border next: -->
		<div class="inputborder"></div>
		
		</div>

What can I do to fix the problem,?

Thanks in advance, Dan.

2

Hi,

Do you have a link as its hard to debug problems like these without seeing the working page?

You could try setting the object elements to display:block or perhaps floating them to kill any whitespace bugs.


.flashborder object{float:left}

Other than that I’d need to see the thing to debug further.:slight_smile:

3

Thank you!
That solved the problem :]