Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 16
  1. #1
    Regular Coder
    Join Date
    Jul 2007
    Location
    Essex, United Kingdom
    Posts
    161
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Thumbs up css borders in firefox please help ???

    This Problem Is Now Fixed.


    hey everyone,

    im having trouble with converting my html table code into css i want one of my tables to have a 1px solid border with color of #464646 i have done this is html using dreamweaver and adding a border to the table under the properties panel but i have been searching for days to find a way to do this, one way i tried changed every one of my tables to the #464646 border color as i only want one of my table borders this color i dont know what to do ? can anyone solve my problem :'-(

    really the only reason i want to do this is so my border does not display with a emboss in firefox that is the only visual error left on my site :-(

    thank you in advance

    James

    P.S my code in html :

    <table width="800" border="1" cellpadding="0" cellspacing="0" bordercolor="#464646">


    This Problem Is Now Fixed.
    Last edited by CSSisthebest; 07-12-2007 at 01:57 AM. Reason: left out something

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,703
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    I’m sorry, what did you say?
    I’ve heard that they have introduced punctuation marks recently… that’s a cool new feature that helps us understand what the hell you are talking about.

  • #3
    Regular Coder
    Join Date
    Jul 2007
    Location
    Essex, United Kingdom
    Posts
    161
    Thanks
    9
    Thanked 0 Times in 0 Posts
    sorry,

    basically i rarely use CSS, but in this case i need to, the whole of my site works fine except my border on one of my tables looks embossed in Firefox and Opera.
    i made sure to use Firefox as my default browser because of its so strict.
    i need to change my border code from HTML to CSS for it to render correctly in Firefox and Opera.

    many thanks

    James

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,703
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    Ahh, OK. Now everything is a little clearer. What you are looking for it the CSS border property. The border and bordercolor attributes are outdated and should be replaced by CSS:
    Code:
    <table style="border: 1px solid #464646;" …>
    I would encourage you to write the CSS into separate stylesheets (external CSS file) to keep the HTML clean:
    Code:
    <head>
    …[meta stuff]…
    …
    <link rel="stylesheet" href="styles.css" type="text/css">
    </head>
    In the CSS file you would write it like this:
    Code:
    table {border: 1px solid #464646;}
    This applies a border around all tables on the pages with this stylesheet.
    However, this only draws a border around the entire table, not each table cell (same goes for my first example wih the style attribute in the table tag). To make that happen you would write:
    Code:
    table {border-collapse: collapse;}
    th, td {border: 1px solid #464646;}

  • #5
    Regular Coder
    Join Date
    Jul 2007
    Location
    Essex, United Kingdom
    Posts
    161
    Thanks
    9
    Thanked 0 Times in 0 Posts
    i understand how it works and stuff but im still a bit confused on how and where i would impliment it into my code.

    would i need a part at the top and a part where my table is, because thats how CSS works most of the time isnt it ?

    im rather confused im properly rambling nonesense lol

  • #6
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,703
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    This is the most simple method:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>Untitled Document</title>
    <style type="text/css">
    table {border-collapse: collapse;}
    td {border: 1px solid #464646;}
    </style>
    </head>
    
    <body>
    <table border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td>cell 1</td>
        <td>cell 2</td>
      </tr>
    </table>
    </body>
    </html>
    
    You have the stylesheet between <style></style> tags in the head section of the document and the HTML in the body section.

    Alternatively (better than internal stylesheets) you save your CSS in an external file with the extension .css (i.e. “styles.css”) and put a link to it in the head of your document:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>Untitled Document</title>
    <link rel="stylesheet" href="styles.css" type="text/css" />
    </head>
    
    <body>
    …
    …

  • #7
    Regular Coder
    Join Date
    Jul 2007
    Location
    Essex, United Kingdom
    Posts
    161
    Thanks
    9
    Thanked 0 Times in 0 Posts
    im still having problems because the css is covering all of my tables.

    do you have an email address i can forward you the html in a notepad document ? because i tried posting my code on here and it takes forever because my code is 353 lines and has javascript in it.

    many thanks

    James

  • #8
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,306
    Thanks
    29
    Thanked 276 Times in 270 Posts
    Quote Originally Posted by CSSisthebest
    im still having problems because the css is covering all of my tables.
    I hope you’re using tables properly; they’re used to directly associate bits of data. They should not be used for page layout.

    One Table
    Code:
    <style type="text/css">
    	#special { border-collapse: collapse; }
    	#special th, #special td { border: 1px solid #464646; }
    </style>
    
    
    
    <table id="special">
    Table Group
    Code:
    <style type="text/css">
    	.special { border-collapse: collapse; }
    	.special th, .special td { border: 1px solid #464646; }
    </style>
    
    
    
    <table class="special">
    
    
    
    <table class="special">
    Last edited by Arbitrator; 07-11-2007 at 11:46 PM. Reason: I forgot to quote what I was responding to.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #9
    Regular Coder
    Join Date
    Jul 2007
    Location
    Essex, United Kingdom
    Posts
    161
    Thanks
    9
    Thanked 0 Times in 0 Posts
    would you be able to add me on msn so that i can send you the html file ? because this has still covered all the tables inside the table that i want the border on with the #464646 border. and yeah im using them for layouts ommmm lol

  • #10
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,518
    Thanks
    3
    Thanked 506 Times in 493 Posts
    answering due to PM but please don't do it again for this forum as CSS is not my thing.

    To target a specific element give it an id of a unique name

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    <title>Untitled Document</title>
    <style type="text/css">
    #fred {border-collapse: collapse;}
    #fred td {border: 1px solid #464646;}
    </style>
    </head>
    
    <body>
    <table id="fred" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td>cell 1</td>
        <td>cell 2</td>
      </tr>
    </table>
    <table id="tom" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td>cell 1</td>
        <td>cell 2</td>
      </tr>
    </table>
    </body>
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #11
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,703
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    Quote Originally Posted by CSSisthebest View Post
    would you be able to add me on msn so that i can send you the html file ?
    I don’t mean to be rude but you know, people here aren’t your personal counselors. You can post your code without problems and you can even attach files to your posts. This way everybody has something to look at and the solution to your problem might help others as well if it’s not kept secret.

    Use the regular reply, not the quick reply (which might get stuck when posting) and there shouldn’t be a problem even with the longest code. Make sure you use the small '#' button in the reply window.

  • #12
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    I, too, am responding to a pm....

    Firstly, would you please post your code - as done so far - so we can check it out properly.
    Secondly, and I suppose personal opinion, don't use dreamweaver to code your pages. I code by hand and don't have such issues.
    Thirdly, if you are using tables for layout - please don't. not only is it incorrect or not symanatic but, your styling issues would possibly be easier solved if you coded symantically. (I am not one of those who eats people alive for incorrect use of tables - its your choice but, when you (anyone), ends up with diffculties then maybe it should be clearer why symantic coding can be easier.

    So again, in summary, post your current code and we can see what is wrong.
    bazz

  • #13
    Regular Coder
    Join Date
    Jul 2007
    Location
    Essex, United Kingdom
    Posts
    161
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Question sorry

    yeah sorry guys for pms i only mentioned my problem and gave a link to this post so i wasnt hiding anything relevant to the question. tables was the way i was taught and i am only now starting to pick up CSS it seems faster but as i am a designer more than a programmer i do my concepts for clients in photoshop then slice them into dreamweaver into tables and also im not a very strong programmer i wish to learn tho . i will attach my code to this post. the table involved is highlighted in blue, there are also many errors like alt tags and not putting # infront of hex codes.

    thanks everyone

    James

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    
    
    
    
    <style type="text/css">
    
    #dropmenudiv{
    position:absolute;
    border:0px solid black;
    border-bottom-width: 0;
    font:normal 13px Times New Roman;
    line-height:18px;
    z-index:100;
    }
    
    #dropmenudiv a{
    width: 100%;
    display: block;
    text-indent: 3px;
    color: #595b5a;
    border-bottom: 0px solid black;
    padding: 1px 0;
    text-decoration: none;
    
    }
    
    #dropmenudiv a:hover{ /*hover background color*/
    background-color: #595b5a;
    color:#FFFFFF;
    }
    
    </style>
    
    <script type="text/javascript">
    
    //***********************************************
    //* AnyLink Drop Down Menu- © Dynamic Drive (www.dynamicdrive.com)
    //* This notice MUST stay intact for legal use
    //* Visit http://www.dynamicdrive.com/ for full source code
    //***********************************************//
    
    //Contents for menu 1
    var menu1=new Array()
    menu1[0]='<a href="maintenance.html">Maintenance</a>'
    menu1[1]='<a href="datarecovery.html">Data Recovery</a>'
    	
    //Contents for menu 2,
    var menu2=new Array()
    menu2[0]='<a href="home.html">Home</a>'
    menu2[1]='<a href="business.html">Business</a>'
    menu2[2]='<a href="wireless.html">Wireless</a>'
    		
    var menu3=new Array()
    menu3[0]='<a href="webdesign.html">Web Design</a>'
    menu3[1]='<a href="webmaintenance.html">Web Maintenance</a>'
    menu3[2]='<a href="portfoliogallery.html">Portfolio Gallery</a>'
    
    var menuwidth='165px' //default menu width
    var menubgcolor='white'  //menu bgcolor
    var disappeardelay=250  //menu disappear speed onMouseout (in miliseconds)
    var hidemenu_onclick="yes" //hide menu when user clicks within menu?
    
    /////No further editting needed
    
    var ie4=document.all
    var ns6=document.getElementById&&!document.all
    
    if (ie4||ns6)
    document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'; opacity: .95; filter: alpha(opacity=95)" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')
    
    function getposOffset(what, offsettype){
    var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
    var parentEl=what.offsetParent;
    while (parentEl!=null){
    totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
    parentEl=parentEl.offsetParent;
    }
    return totaloffset;
    }
    
    
    function showhide(obj, e, visible, hidden, menuwidth){
    if (ie4||ns6)
    dropmenuobj.style.left=dropmenuobj.style.top="-500px"
    if (menuwidth!=""){
    dropmenuobj.widthobj=dropmenuobj.style
    dropmenuobj.widthobj.width=menuwidth
    }
    if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
    obj.visibility=visible
    else if (e.type=="click")
    obj.visibility=hidden
    }
    
    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }
    
    function clearbrowseredge(obj, whichedge){
    var edgeoffset=-3
    if (whichedge=="rightedge"){
    var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
    dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
    if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
    edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
    }
    else{
    var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
    var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
    dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
    if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
    edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
    if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
    edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
    }
    }
    return edgeoffset
    }
    
    function populatemenu(what){
    if (ie4||ns6)
    dropmenuobj.innerHTML=what.join("")
    }
    
    
    function dropdownmenu(obj, e, menucontents, menuwidth){
    if (window.event) event.cancelBubble=true
    else if (e.stopPropagation) e.stopPropagation()
    clearhidemenu()
    dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
    populatemenu(menucontents)
    
    if (ie4||ns6){
    showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
    
    dropmenuobj.x=getposOffset(obj, "left")
    dropmenuobj.y=getposOffset(obj, "top")
    dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
    dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
    }
    
    return clickreturnvalue()
    }
    
    function clickreturnvalue(){
    if (ie4||ns6) return false
    else return true
    }
    
    function contains_ns6(a, b) {
    while (b.parentNode)
    if ((b = b.parentNode) == a)
    return true;
    return false;
    }
    
    function dynamichide(e){
    if (ie4&&!dropmenuobj.contains(e.toElement))
    delayhidemenu()
    else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
    delayhidemenu()
    }
    
    function hidemenu(e){
    if (typeof dropmenuobj!="undefined"){
    if (ie4||ns6)
    dropmenuobj.style.visibility="hidden"
    }
    }
    
    function delayhidemenu(){
    if (ie4||ns6)
    delayhide=setTimeout("hidemenu()",disappeardelay)
    }
    
    function clearhidemenu(){
    if (typeof delayhide!="undefined")
    clearTimeout(delayhide)
    }
    
    if (hidemenu_onclick=="yes")
    document.onclick=hidemenu
    
    </script>
    
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    <!--
    .style1 {
    	font-family: Georgia;
    	font-style: italic;
    	font-size: 20px;
    	color: #fb7116;
    }
    .style3 {
    	font-size: 12px;
    	color: #464646;
    }
    .style4 {font-size: 20px; color: #fb7116; font-family: Georgia;}
    .style9 {
    	font-size: 16px;
    	font-family: "Times New Roman", Times, serif;
    }
    .style10 {color: #ffffff}
    .style11 {font-family: "Times New Roman", Times, serif}
    .style12 {color: #ffffff; font-family: "Times New Roman", Times, serif; }
    a:link {
    	text-decoration: none;
    	color: #FFFFFF;
    }
    a:visited {
    	text-decoration: none;
    }
    a:hover {
    	text-decoration: none;
    }
    a:active {
    	text-decoration: none;
    }
    body {
    	background-color: #c0c0c0;
    }
    
    
    
    a.botnav:link {
    	text-decoration: none;
    	color: #464646;
    }
    a.botnav:visited {
    	text-decoration: none;
    }
    a.botnav:hover {
    	text-decoration: none;
    }
    a.botnav:active {
    	text-decoration: none;
    }
    body {
    	background-color: #c0c0c0;
    }
    
    
    
    a.home:link {
    	text-decoration: none;
    	color: #000000;
    }
    a.home:visited {
    	text-decoration: none;
    }
    a.home:hover {
    	text-decoration: none;
    }
    a.home:active {
    	text-decoration: none;
    }
    body {
    	background-color: #c0c0c0;
    }
    
    
    
    .style15 {
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #464646;
    	
    
    
    	
    }
    -->
    </style>
    </head>
    
    <body>
    <table width="200" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td valign="top">&nbsp;</td>
      </tr>
      <tr>
        <td><table width="800" border="1" cellpadding="0" cellspacing="0" bordercolor="464646">
          <tr>
            <td><table width="800" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td><img src="header.gif" width="800" height="66">
                    <table width="800" height="32" border="0" cellpadding="0" cellspacing="0">
                      <tr>
                        <td width="800" height="34" background="homebuto_02.jpg"><table width="800" height="32" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                              <td width="218">&nbsp;</td>
                              <td width="48"><div align="center"><span class="style9"><a href="index.html" class="home">Home</a></span></div></td>
                              <td width="80"><div align="center" class="style10 style11"><a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '150px')" onMouseout="delayhidemenu()">IT Services </a></div></td>
                              <td width="85"><div align="center" class="style12"><a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu2, '150px')" onMouseout="delayhidemenu()">Networking</a></div></td>
                              <td width="90"><div align="center" class="style12"><a href="servicearea.html">Service Area </a></div></td>
                              <td width="98"><div align="center" class="style12"><a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu3, '150px')" onMouseout="delayhidemenu()">Web Solutions </a></div></td>
                              <td width="181"><span class="style12"><a href="rates.html">&nbsp;&nbsp;Rates</a></span></td>
                            </tr>
                        </table></td>
                      </tr>
                  </table></td>
              </tr>
              <tr>
                <td><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="800" height="180" align="texttop" >
                    <param name="movie" value="technolanebanner.swf">
                    <param name="wmode" value="transparent">
                    <param name="quality" value="high">
                    <embed src="technolanebanner.swf" wmode="transparent" width="800" height="180" align="texttop" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
                </object></td>
              </tr>
              <tr>
                <td><table width="800" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td width="70" bgcolor="#FFFFFF">&nbsp;</td>
                      <td width="250" align="left" valign="top" bgcolor="#FFFFFF"><div align="justify"><span class="style1"><br>
                                <br>
                  Technolane IT Services<br>
                          </span><span class="style4"><span class="style3"><br>
                  Curabitur facilisis, libero et ultricies auctor, augue metus congue odio, eu rhoncus diam libero et magna. Donec nisi felis, dapibus vel, dignissim et, laoreet tincidunt, lectus. Nam sit amet tortor at orci congue lacinia. Donec in libero vel libero tempor ornare. Sed dapibus ante at enim. Donec fermentum, augue id accumsan mollis, est lectus vestibulum nisl, eget ullamcorper nulla justo ac dolor. </span></span><span class="style1"><br>
              </span></div></td>
                      <td width="70" bgcolor="#FFFFFF">&nbsp;</td>
                      <td width="250" align="left" valign="top" bgcolor="#FFFFFF"><div align="justify"><span class="style1"><br>
                                <br>
                  Technolane Web Solutions<br>
                          </span><span class="style4"><span class="style3"><br>
                  Curabitur facilisis, libero et ultricies auctor, augue metus congue odio, eu rhoncus diam libero et magna. Donec nisi felis, dapibus vel, dignissim et, laoreet tincidunt, lectus. Nam sit amet tortor at orci congue lacinia. Donec in libero vel libero tempor ornare. Sed dapibus ante at enim. Donec fermentum, augue id accumsan mollis, est lectus vestibulum nisl, eget ullamcorper nulla justo ac dolor. </span></span><span class="style1"><br>
                  <br>
              </span></div></td>
                      <td width="160" bgcolor="#FFFFFF">&nbsp;</td>
                    </tr>
                </table></td>
              </tr>
            </table></td>
          </tr>
        </table></td>
      </tr>
      <tr>
        <td valign="top"><div align="center" class="style15"><br>
            <span class="botnav"><a href="index.html" class="botnav">Home</a> |<a href="servicearea.html" class="botnav"> Service Area</a> | <a href="rates.html" class="botnav">Rates</a> | <a href="contactus.html" class="botnav">Contact Us</a> | <a href="usefullinks.html" class="botnav">Links</a> </span></div></td>
      </tr>
      <tr>
        <td valign="top">&nbsp;</td>
      </tr>
    </table>
     <script language="JScript" type="text/jscript" src="http://scripts.ediy.co.nz/scripts/NoIEActivate.js"></script>
    </body>
    </html>

  • #14
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    Well I see no css for the table - any table. If sticking with tables I would suggest that you assing a class to each of them and for the one you have the issue with try this code.

    html
    Code:
    <table class="whatever_class_you_chose" width="800" border="1" cellpadding="0" cellspacing="0" bordercolor="464646">
    .whatever_class_name_you_chose {
    border : 1px solid #464646
    }

    you can place the other tags from your html into the css too when you become more proficient.

    have you a link too that I can see how it presently shows

    bazz
    Last edited by bazz; 07-12-2007 at 01:42 AM.

  • #15
    Regular Coder
    Join Date
    Jul 2007
    Location
    Essex, United Kingdom
    Posts
    161
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Thumbs up Fixed

    You Sir are a God among men, but seriously that worked fantasticly

    many many many thanks

    James

    P.S: thanks everyone else who helped me around this problem.

    here is how i changed the code for others with the same problem:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    
    
    
    
    <style type="text/css">
    
    #dropmenudiv{
    position:absolute;
    border:0px solid black;
    border-bottom-width: 0;
    font:normal 13px Times New Roman;
    line-height:18px;
    z-index:100;
    }
    
    #dropmenudiv a{
    width: 100%;
    display: block;
    text-indent: 3px;
    color: #595b5a;
    border-bottom: 0px solid black;
    padding: 1px 0;
    text-decoration: none;
    
    }
    
    #dropmenudiv a:hover{ /*hover background color*/
    background-color: #595b5a;
    color:#FFFFFF;
    }
    
    </style>
    
    <script type="text/javascript">
    
    //***********************************************
    //* AnyLink Drop Down Menu- © Dynamic Drive (www.dynamicdrive.com)
    //* This notice MUST stay intact for legal use
    //* Visit http://www.dynamicdrive.com/ for full source code
    //***********************************************//
    
    //Contents for menu 1
    var menu1=new Array()
    menu1[0]='<a href="maintenance.html">Maintenance</a>'
    menu1[1]='<a href="datarecovery.html">Data Recovery</a>'
    	
    //Contents for menu 2,
    var menu2=new Array()
    menu2[0]='<a href="home.html">Home</a>'
    menu2[1]='<a href="business.html">Business</a>'
    menu2[2]='<a href="wireless.html">Wireless</a>'
    		
    var menu3=new Array()
    menu3[0]='<a href="webdesign.html">Web Design</a>'
    menu3[1]='<a href="webmaintenance.html">Web Maintenance</a>'
    menu3[2]='<a href="portfoliogallery.html">Portfolio Gallery</a>'
    
    var menuwidth='165px' //default menu width
    var menubgcolor='white'  //menu bgcolor
    var disappeardelay=250  //menu disappear speed onMouseout (in miliseconds)
    var hidemenu_onclick="yes" //hide menu when user clicks within menu?
    
    /////No further editting needed
    
    var ie4=document.all
    var ns6=document.getElementById&&!document.all
    
    if (ie4||ns6)
    document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'; opacity: .95; filter: alpha(opacity=95)" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')
    
    function getposOffset(what, offsettype){
    var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
    var parentEl=what.offsetParent;
    while (parentEl!=null){
    totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
    parentEl=parentEl.offsetParent;
    }
    return totaloffset;
    }
    
    
    function showhide(obj, e, visible, hidden, menuwidth){
    if (ie4||ns6)
    dropmenuobj.style.left=dropmenuobj.style.top="-500px"
    if (menuwidth!=""){
    dropmenuobj.widthobj=dropmenuobj.style
    dropmenuobj.widthobj.width=menuwidth
    }
    if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
    obj.visibility=visible
    else if (e.type=="click")
    obj.visibility=hidden
    }
    
    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }
    
    function clearbrowseredge(obj, whichedge){
    var edgeoffset=-3
    if (whichedge=="rightedge"){
    var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
    dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
    if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
    edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
    }
    else{
    var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
    var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
    dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
    if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
    edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
    if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
    edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
    }
    }
    return edgeoffset
    }
    
    function populatemenu(what){
    if (ie4||ns6)
    dropmenuobj.innerHTML=what.join("")
    }
    
    
    function dropdownmenu(obj, e, menucontents, menuwidth){
    if (window.event) event.cancelBubble=true
    else if (e.stopPropagation) e.stopPropagation()
    clearhidemenu()
    dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
    populatemenu(menucontents)
    
    if (ie4||ns6){
    showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
    
    dropmenuobj.x=getposOffset(obj, "left")
    dropmenuobj.y=getposOffset(obj, "top")
    dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
    dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
    }
    
    return clickreturnvalue()
    }
    
    function clickreturnvalue(){
    if (ie4||ns6) return false
    else return true
    }
    
    function contains_ns6(a, b) {
    while (b.parentNode)
    if ((b = b.parentNode) == a)
    return true;
    return false;
    }
    
    function dynamichide(e){
    if (ie4&&!dropmenuobj.contains(e.toElement))
    delayhidemenu()
    else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
    delayhidemenu()
    }
    
    function hidemenu(e){
    if (typeof dropmenuobj!="undefined"){
    if (ie4||ns6)
    dropmenuobj.style.visibility="hidden"
    }
    }
    
    function delayhidemenu(){
    if (ie4||ns6)
    delayhide=setTimeout("hidemenu()",disappeardelay)
    }
    
    function clearhidemenu(){
    if (typeof delayhide!="undefined")
    clearTimeout(delayhide)
    }
    
    if (hidemenu_onclick=="yes")
    document.onclick=hidemenu
    
    </script>
    
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    <!--
    .style1 {
    	font-family: Georgia;
    	font-style: italic;
    	font-size: 20px;
    	color: #fb7116;
    }
    .style3 {
    	font-size: 12px;
    	color: #464646;
    }
    .style4 {font-size: 20px; color: #fb7116; font-family: Georgia;}
    .style9 {
    	font-size: 16px;
    	font-family: "Times New Roman", Times, serif;
    }
    .style10 {color: #ffffff}
    .style11 {font-family: "Times New Roman", Times, serif}
    .style12 {color: #ffffff; font-family: "Times New Roman", Times, serif; }
    a:link {
    	text-decoration: none;
    	color: #FFFFFF;
    }
    a:visited {
    	text-decoration: none;
    }
    a:hover {
    	text-decoration: none;
    }
    a:active {
    	text-decoration: none;
    }
    body {
    	background-color: #c0c0c0;
    }
    
    
    
    a.botnav:link {
    	text-decoration: none;
    	color: #464646;
    }
    a.botnav:visited {
    	text-decoration: none;
    }
    a.botnav:hover {
    	text-decoration: none;
    }
    a.botnav:active {
    	text-decoration: none;
    }
    body {
    	background-color: #c0c0c0;
    }
    
    
    
    a.home:link {
    	text-decoration: none;
    	color: #000000;
    }
    a.home:visited {
    	text-decoration: none;
    }
    a.home:hover {
    	text-decoration: none;
    }
    a.home:active {
    	text-decoration: none;
    }
    body {
    	background-color: #c0c0c0;
    }
    
    
    
    .style15 {
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #464646;
    	
    
    
    	
    }
    
    .outsidetable1 {
    border : 0px solid 
    }
    
    .outsidetable2 {
    border : 2px solid #464646
    }
    
    .outsidetable3 {
    border : 0px solid 
    }
    
    .outsidetable4 {
    border : 0px solid 
    }
    
    .outsidetable5 {
    border : 0px solid 
    }
    
    .outsidetable6 {
    border : 0px solid 
    }
    -->
    </style>
    </head>
    
    <body>
    <table class="outsidetable1" width="200" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td valign="top">&nbsp;</td>
      </tr>
      <tr>
        <td><table class="outsidetable2" width="200" border="0" cellpadding="0" cellspacing="0">
          <tr>
            <td><table class="outsidetable3" width="200" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td><img src="header.gif" width="800" height="66">
                    <table class="outsidetable4" width="800" height="32" border="0" cellpadding="0" cellspacing="0">
                      <tr>
                        <td class="outsidetable6" width="800" height="34" background="homebuto_02.jpg"><table width="800" height="32" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                              <td width="218">&nbsp;</td>
                              <td width="48"><div align="center"><span class="style9"><a href="index.html" class="home">Home</a></span></div></td>
                              <td width="80"><div align="center" class="style10 style11"><a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '150px')" onMouseout="delayhidemenu()">IT Services </a></div></td>
                              <td width="85"><div align="center" class="style12"><a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu2, '150px')" onMouseout="delayhidemenu()">Networking</a></div></td>
                              <td width="90"><div align="center" class="style12"><a href="servicearea.html">Service Area </a></div></td>
                              <td width="98"><div align="center" class="style12"><a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu3, '150px')" onMouseout="delayhidemenu()">Web Solutions </a></div></td>
                              <td width="181"><span class="style12"><a href="rates.html">&nbsp;&nbsp;Rates</a></span></td>
                            </tr>
                        </table></td>
                      </tr>
                  </table></td>
              </tr>
              <tr>
                <td><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="800" height="180" align="texttop" >
                    <param name="movie" value="technolanebanner.swf">
                    <param name="wmode" value="transparent">
                    <param name="quality" value="high">
                    <embed src="technolanebanner.swf" wmode="transparent" width="800" height="180" align="texttop" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
                </object></td>
              </tr>
              <tr>
                <td><table class="outsidetable5" width="800" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td width="70" bgcolor="#FFFFFF">&nbsp;</td>
                      <td width="250" align="left" valign="top" bgcolor="#FFFFFF"><div align="justify"><span class="style1"><br>
                                <br>
                  Technolane IT Services<br>
                          </span><span class="style4"><span class="style3"><br>
                  Curabitur facilisis, libero et ultricies auctor, augue metus congue odio, eu rhoncus diam libero et magna. Donec nisi felis, dapibus vel, dignissim et, laoreet tincidunt, lectus. Nam sit amet tortor at orci congue lacinia. Donec in libero vel libero tempor ornare. Sed dapibus ante at enim. Donec fermentum, augue id accumsan mollis, est lectus vestibulum nisl, eget ullamcorper nulla justo ac dolor. </span></span><span class="style1"><br>
              </span></div></td>
                      <td width="70" bgcolor="#FFFFFF">&nbsp;</td>
                      <td width="250" align="left" valign="top" bgcolor="#FFFFFF"><div align="justify"><span class="style1"><br>
                                <br>
                  Technolane Web Solutions<br>
                          </span><span class="style4"><span class="style3"><br>
                  Curabitur facilisis, libero et ultricies auctor, augue metus congue odio, eu rhoncus diam libero et magna. Donec nisi felis, dapibus vel, dignissim et, laoreet tincidunt, lectus. Nam sit amet tortor at orci congue lacinia. Donec in libero vel libero tempor ornare. Sed dapibus ante at enim. Donec fermentum, augue id accumsan mollis, est lectus vestibulum nisl, eget ullamcorper nulla justo ac dolor. </span></span><span class="style1"><br>
                  <br>
              </span></div></td>
                      <td width="160" bgcolor="#FFFFFF">&nbsp;</td>
                    </tr>
                </table></td>
              </tr>
            </table></td>
          </tr>
        </table></td>
      </tr>
      <tr>
        <td valign="top"><div align="center" class="style15"><br>
            <span class="botnav"><a href="index.html" class="botnav">Home</a> |<a href="servicearea.html" class="botnav"> Service Area</a> | <a href="rates.html" class="botnav">Rates</a> | <a href="contactus.html" class="botnav">Contact Us</a> | <a href="usefullinks.html" class="botnav">Links</a> </span></div></td>
      </tr>
      <tr>
        <td valign="top">&nbsp;</td>
      </tr>
    </table>
     <script language="JScript" type="text/jscript" src="http://scripts.ediy.co.nz/scripts/NoIEActivate.js"></script>
    </body>
    </html>


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •