SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Mar 2002
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Target a table with CSS

    I have a 3 tables that i wish to use seperate images for backgrounds using CSS so i can prevent tiling. I believe you can name individual tables, ie name="logo". So form here, how do i code an external style sheet to achieve this?

    I can't even get an embedded style to work....
    <head>
    <style type="text/css">
    .logo { background: url(logo.jpg)no-repeat; }
    </style>
    </head>
    <body>
    <table class="logo" width="900" border="0" cellpadding="0" cellspacing="0">
    <tr>
    <td width="800" height="95"></td>
    </tr>
    </table>
    </body>
    In dreamweaver, in design view, the image appears correctly. When i preview in IE6 the image doesn't display?
    Sorry for the newbie question, appreciate any help with this.
    Thanks.

    Sorry, got the inline style working.
    <style type="text/css">
    .logo { background: #6079A5 url(logo.jpg);
    background-repeat: no-repeat; }
    </style>
    Can anyone helpe with the syntax for an external sheet? Thanks.
    Last edited by revert; Mar 9, 2002 at 02:16.

  2. #2
    SitePoint Addict Caterwomtious's Avatar
    Join Date
    Dec 2001
    Posts
    222
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You're almost there already...

    Take your code:

    <style type="text/css">
    .logo { background: #6079A5 url(logo.jpg);
    background-repeat: no-repeat; }
    </style>


    Lose the <style> tags:

    .logo { background: #6079A5 url(logo.jpg);
    background-repeat: no-repeat; }

    and save it as yourfilename.css.


    Since you're using Dreamweaver you don't need to type a <link> tag. Open up the CSS Styles palette and click the first of the four buttons at the bottom - attach style sheet. Browse to your CSS file and you're done.

    Be aware though that you shouldn't rely on Dreamweaver's display of CSS. There are a few styles it does show, and many, many more that it doesn't. Always keep a few browsers handy.

  3. #3
    SitePoint Member
    Join Date
    Mar 2002
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Great, thanks for your help Groovetown. Actually it's not working. In my external style sheet i have...

    .logo { background: #6079A5 url(logo.jpg);
    background-repeat: no-repeat;}
    .navbar { background: #6079A5 url(navbar.jpg);
    background-repeat: no-repeat;}

    .lowbar { background: #6079A5 url(lwrbar.jpg);
    background-repeat: no-repeat;}
    in my html...
    <table class="logo" width="760" border="0" cellpadding="0" cellspacing="0">

    <table class="navbar" width="150" border="0" cellpadding="0" cellspacing="0">

    <table class="lowbar" width="100%" border="0" cellpadding="0" cellspacing="0">

    Strange that navbar and lowbar both load but logo is blank. Any ideas?
    Last edited by revert; Mar 9, 2002 at 11:03.

  4. #4
    SitePoint Addict Caterwomtious's Avatar
    Join Date
    Dec 2001
    Posts
    222
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My best guess would be to check and double-check the filename for the one that doesn't work. I just cut and pasted your exact code, replaced the URL of the image and it worked just fine.

  5. #5
    SitePoint Member
    Join Date
    Mar 2002
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's working now, thanks.
    Last edited by revert; Mar 9, 2002 at 21:54.


Bookmarks

Posting Permissions

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