#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    130
    Rep Power
    11

    Could a css expert give a hand in converting table structure?


    Hey, i've made a dropdown menu using part css and part tables, and decided it might be best to convert it fully to css. so could someone give a helping hand in converting the following code?
    I'll just put a simple segment down and am sure I could convert the rest.

    .html:
    Code:
    <div id = "menulayout">
        <table border="1" cellspacing="5" cellpadding="0" width="100" bordercolor="#339999"><tr>
    
            <td background="HilaryMenu_off.jpg" alt="Hilary" bordercolor="#FFFFFF">
                <div id="HILARY" style="width: 74px;" onMouseover="menuOverTest(); return !showMenuTest('1', 
    event, 'HILARY');"  class="MenuHeader" onMouseOut="menuOutTest();">
                    <a href="#" onMouseOver="JSFX.fadeIn('HilaryMenu')" 
    onMouseOut="JSFX.fadeOut('HilaryMenu')"><img name="HilaryMenu" class="imgFader" 
    src="HilaryMenu_off.jpg" alt="Hilary" width="74" height="55" border="0"></a>
                </div>
    
                <div id="MENU1" onmouseover="event.cancelBubble = true;" class="Menu">
                    <table border="1" cellspacing="2" cellpadding="0" width="100" bordercolor="#339999">
    
                        <tr>
                            <td bgcolor="#277D70" width="100%" height="15" onMouseover="this.style.backgroundColor = 
    '#339999';" onMouseout = "this.style.backgroundColor = '#277D70';" bordercolor="277D70">
                                <img src="space.gif" width="5" height="2" border="0"><a href="#" class="MenuItem" 
    onMouseOut="menuOutTest();" onMouseOver="menuOverTest();">MenuItem</a>
    
                            </td>
                        </tr>
    
                    </table>
                </div>
            </td>
    
        </tr>
        </table>
    </div>

    thanx,
    -Luke
  2. #2
  3. nx
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2003
    Location
    USA
    Posts
    626
    Rep Power
    0
    i proly would help you at the moment...but im somewhat busy, so i can get back to you, but in case i cannot, what exactly is it that youre having trouble with converting?
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    130
    Rep Power
    11
    Well thanx if u can lend a hand.
    But i'm pretty new to css and i'm not really sure where to begin to go about converting. The main thing really, is the nested tables and cells etc. I haven't had any experience using nested with style sheets.

    thanx,
    -Luke
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    130
    Rep Power
    11
    I'll give it a go and see how I do.


    -Luke
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    130
    Rep Power
    11
    Okay, I seem to be managing myself pretty well (As per usual on these forums ), But I was hoping someone could tell me the difference between an ID and a CLASS. And also what difference between putting a pound sign "#" before something in the .css file makes.

    Thanx ,
    -Luke
  10. #6
  11. nx
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2003
    Location
    USA
    Posts
    626
    Rep Power
    0
    well...first off, ID's can be called differently with js, but in css, ID's and classes are pretty much the same.
    however, for your next question:....
    when you write
    #somename
    {
    }
    that means you are giving the element with the ID of somename the styles included. and, as you prolly already know, you would write
    .somename
    {
    }
    to give the element with the class of somename the included styles

    if ya need any more help, just ask
  12. #7
  13. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Posts
    130
    Rep Power
    11
    Yeah thanx. Actually i'd found that out a short while before you posted. Yeah, the ID's are for defining a unique identifier for an element, and a class is for assigning a group of elements.

    Thanx anyway tho
    -Luke

IMN logo majestic logo threadwatch logo seochat tools logo