Giant bullets in explorer, but firefox shows them correctly.

Discussion in 'HTML & Website Design' started by auron990, Jun 3, 2007.

  1. #1
    I got a bullet list on my page. The text is in 12 font, but the bullets arn't the same font in explorer. Firefox shows the bullets in the correct font, but not explorer. Why?
    Heres the coding
    <td width="255"><ul>
    <li class="BoxStyle">Solar Panels are made up of <span class="BlueHighlight">photovoltaic cells</span>.</li>
    <li class="BoxStyle">When sunlight hits a <span class="BlueHighlight">photovoltaic cell</span> electricity is produced. </li>
    <li class="BoxStyle">The highest power a solar panel can reach is 5,300 MW. </li>
    <li class="BoxStyle"><span class="BlueHighlight">Photovoltaic cells</span> can be combined into a solar panel which consist of many cells contributing electricity. </li>
    <li class="BoxStyle">Solar Panels are expensive due to the rise of the price of silicon, but the product is well worth it. </li>
    </ul></td>
     
    auron990, Jun 3, 2007 IP
  2. arnold

    arnold Active Member

    Messages:
    837
    Likes Received:
    52
    Best Answers:
    0
    Trophy Points:
    80
    #2
    have you tried adding <font> prior to your html tags?
     
    arnold, Jun 3, 2007 IP
  3. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    436
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Auron, what's the rest of the code look like?

    Arnold, <font> tags have been deprecated (rendered obsolete) and are slated for removal from the HTML specification itself.
     
    Dan Schulz, Jun 3, 2007 IP
  4. josh_coffman

    josh_coffman Peon

    Messages:
    175
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    0
    #4
    what is the css code you have for .BoxStyle?
     
    josh_coffman, Jun 3, 2007 IP
  5. auron990

    auron990 Peon

    Messages:
    51
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #5
    .Box_Style {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #000000;
    }
     
    auron990, Jun 3, 2007 IP
  6. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    436
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Ok, what about the rest of the code? (A link would be nice also.)
     
    Dan Schulz, Jun 3, 2007 IP
  7. auron990

    auron990 Peon

    Messages:
    51
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #7
    I havent hosted my site yet.
    Heres the whole pages code.




    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <!-- saved from url=(0014)about:internet -->
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Solar Power Smart</title>
    <meta name="Description" content="This site has all your basic needs about anything that has to do with solar power. Learn about solar panels, solar cars, solar generators, solar batteries, solar garden lights and many other things,">
    <meta name="Keywords" content="solar, power, panel, energy, generator, electricity, light, panels">

    <style type="text/css">
    <!--
    body {
    font: 100% Verdana, Arial, Helvetica, sans-serif;
    background: #666666;
    margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
    padding: 0;
    text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
    color: #000000;
    }
    .twoColFixLt #container {
    width: 780px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
    background: #FFFFFF;
    margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
    border: 1px solid #000000;
    text-align: left; /* this overrides the text-align: center on the body element. */
    }
    .twoColFixLt #sidebar1 {
    float: left; /* since this element is floated, a width must be given */
    width: 200px; /* the background color will be displayed for the length of the content in the column, but no further */
    padding: 15px 10px 15px 20px;
    background-color: #FFFFFF;
    }
    .twoColFixLt #mainContent {
    margin: 0 0 0 250px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
    padding: 0 20px 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
    }
    .fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
    float: right;
    margin-left: 8px;
    }
    .fltlft { /* this class can be used to float an element left in your page */
    float: left;
    margin-right: 8px;
    }
    .clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
    clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
    }
    .BlueHighlight {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #0000FF;
    text-decoration: underline;
    }
    .BoxStyle {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    color: #000000;
    }
    -->
    </style>
    <!--[if IE 5]>
    <style type="text/css">
    /* place css box model fixes for IE 5* in this conditional comment */
    .twoColFixLt #sidebar1 { width: 230px; }
    </style>
    <![endif]--><!--[if IE]>
    <style type="text/css">
    /* place css fixes for all versions of IE in this conditional comment */
    .twoColFixLt #sidebar1 { padding-top: 30px; }
    .twoColFixLt #mainContent { zoom: 1; }
    /* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
    </style>
    <![endif]-->
    <link href="SolarCss.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    <!--
    .style2 {font-size: 12px}
    -->
    </style></head>

    <body class="twoColFixLt">
    <div id="container">
    <table width="100%" border="1" cellspacing="0" cellpadding="5">
    <tr>
    <td><table width="100%" border="1" cellspacing="0" cellpadding="5">
    <tr>
    <td><!-- #BeginLibraryItem "/Library/Banner.lbi" -->
    <img src="Images/SolarSmart Banner.jpg" alt="Banner" width="753" height="175"><!-- #EndLibraryItem --></td>
    </tr>
    </table></td>
    </tr>
    </table>
    <table width="100%" border="1" cellspacing="0" cellpadding="5">
    <tr>
    <td><script type="text/javascript"><!--
    google_ad_client = "pub-9497115440591095";
    google_ad_width = 728;
    google_ad_height = 15;
    google_ad_format = "728x15_0ads_al_s";
    //2007-06-02: SolarPower
    google_ad_channel = "2937339496";
    google_color_border = "FFFFFF";
    google_color_bg = "FFFFFF";
    google_color_link = "0000FF";
    google_color_text = "000000";
    google_color_url = "008000";
    //-->
    </script>
    <script type="text/javascript"
    src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script></td>
    </tr>
    </table>
    <div id="sidebar1"><!-- #BeginLibraryItem "/Library/Menu.lbi" -->
    <style type="text/css">
    <!--
    .style4 {font-size: 12px; font-weight: bold; }
    -->
    </style>
    <table width="148" height="455" border="1" cellpadding="5" cellspacing="0" id="Menu">
    <tr>
    <td width="134"><div align="center"><a href="index.html" class="style4">Home</a></div></td>
    </tr>
    <tr>
    <td><div align="center"><a href="Basic.html" class="style4">Solar Power Basic</a></div></td>
    </tr>
    <tr>
    <td><div align="center"><a href="Uses.html" class="style4">How Its Used</a></div></td>
    </tr>
    <tr>
    <td><div align="center"><a href="Benefits.html" class="style4">Solar Power Benefits</a></div></td>
    </tr>
    <tr>
    <td><div align="center"><a href="Links.html" class="style4">Links</a></div></td>
    </tr>
    <tr>
    <td background="Contact.html"><div align="center"><a href="Contact.html" class="style4">Contact Me</a></div></td>
    </tr>
    </table><!-- #EndLibraryItem --><h3>&nbsp;</h3>
    <!-- end #sidebar1 --></div>
    <div id="mainContent">
    <p>&nbsp;</p>
    <h1>The Basics of Solar Panels</h1>
    <p><img src="Images/Basic_Picture.jpg" alt="Solar Panel" width="479" height="315" /></p>
    <table border="1" cellpadding="5" cellspacing="0">
    <tr>
    <td width="255"><ul>
    <li class="Box_Style">Solar Panels are made up of <span class="BlueHighlight">photovoltaic cells</span>.</li>
    <li class="Box_Style">When sunlight hits a<span class="BlueHighlight"> photovoltaic cell</span> electricity is produced. </li>
    <li class="Box_Style">The highest power a solar panel can reach is 5,300 MW. </li>
    <li class="Box_Style"><span class="BlueHighlight">Photovoltaic cells</span> can be combined into a solar panel which consist of many cells contributing electricity. </li>
    <li class="Box_Style">Solar Panels are expensive due to the rise of the price of silicon, but the product is well worth it. </li>
    </ul></td>
    <td width="209"><script type="text/javascript"><!--
    google_ad_client = "pub-9497115440591095";
    google_ad_width = 300;
    google_ad_height = 250;
    google_ad_format = "300x250_as";
    google_ad_type = "text";
    //2007-06-03: SolarPower
    google_ad_channel = "2937339496";
    google_color_border = "FFFFFF";
    google_color_bg = "FFFFFF";
    google_color_link = "0000FF";
    google_color_text = "000000";
    google_color_url = "000000";
    //-->
    </script>
    <script type="text/javascript"
    src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script></td>
    </tr>
    </table>
    <h2>How Solar Panels Work</h2>
    <table width="485" border="1" cellspacing="0" cellpadding="5">
    <tr>
    <td width="233"><ul class="BoxStyle">
    <li class="Box_Style">The individual cells in <span class="BlueHighlight">solar panels</span> have a semiconductor such as silicon in them. </li>
    <li class="Box_Style">When the sun energizes the semiconductor, electron are knocked off and are free.</li>
    <li class="Box_Style">Then an electric field is implimented to direct the electrons into a current.</li>
    <li class="Box_Style">This current made by the electric field is what provides energy to what ever you want to power via <span class="BlueHighlight">solar panels</span>. </li>
    </ul>
    </td>
    <td width="226"><script type="text/javascript"><!--
    google_ad_client = "pub-9497115440591095";
    google_ad_width = 300;
    google_ad_height = 250;
    google_ad_format = "300x250_as";
    google_ad_type = "text";
    //2007-06-03: SolarPower
    google_ad_channel = "2937339496";
    google_color_border = "FFFFFF";
    google_color_bg = "FFFFFF";
    google_color_link = "0000FF";
    google_color_text = "000000";
    google_color_url = "000000";
    //-->
    </script>
    <script type="text/javascript"
    src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script></td>
    </tr>
    </table>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <!-- end #mainContent --></div>
    <!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
    <!-- end #container --></div>
    </body>
    </html>
     
    auron990, Jun 3, 2007 IP