News:

Go to HostNed.com
Welcome.  This is a place to get user-to-user support, learn more, and share ideas.  If you can't find your answers here, feel free to ask by creating a new topic or visit the support ticket system at https://my.hostned.com :)  Have fun here!

Main Menu

CSS, Javascript Objects and Firefox.

Started by Dragonfighter, June 13, 2007, 03:18:59 AM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

Dragonfighter

Hello.  I am about to pull out my few remaining hairs here.  I have a resources page on my site and am using other sites' banners as links.  They are all in DIVs defined in the CSS and all align center perfectly in both IE and Firefox.  The page is standards compliant. 

The problem now is with the last resource.  It is a search form called up by Javascript, provided by the hosting site.  When I place the code in the same class of DIV as the others the DIV and the Form centers in IE but floats left in Firefox.

The page is here.

The CSS:
Quote
DIV.caption
{
   
         width: auto;
   height: auto;
   position: relative;
   padding: 0px;
   margin-left: auto;
   margin-right: auto;
   text-align: center;
}

DIV.banner
{
   width: auto;
   height: auto;
   position: relative;
   padding: 0px;
   margin-top: 20px;
   margin-left: auto;
   margin-right: auto;
   text-align: center;
}

The HTML:
Quote
<div class="banner">
          <script language="Javascript"  src="http://www.studylight.org/jscripts/searchcode.cgi?type=interlinear"   border="0"   alt="StudyLight dot Org"></script>
          <div class="caption">
         <p class="captions">An excellent resource for an in depth searching of Scripture.</p>
         </div>
</div>

Any ideas would be greatly appreciated.

Dynaweb

In your CSS, try adding "margin: 0 auto" to make the alignation (is that even a word?) in Firefox and other browsers.

Dragonfighter

Thanks, I tried it with both the original margin definitions and also deleting them.  No joy.  Ah well off to Florida, I'll ook again when I get back.