Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 7 of 7
  1. #1
    Member
    Join Date
    Feb 2004
    Posts
    76
    Member #
    4909
    I am having a few problems with this whole multiple links style thing, evreything that I have read works but not the way I want it to.

    I want to have different links in 3 sections of a page, in the main content, side content and in the breadcrumb trail section. I have made the site with one table and split it up then nested other tables where I want them so that I can apply the styles to certian tables.

    So far I have made all the seperate style sheets for each table, including the link styles, so in theory I should just be able to apply the different styles to the different tables and have all the text and different styled links formated nicly, this is where reality shows it's ugly mug... All of the tables use only 1 style for all of the links, not the seperate styles in the style sheet that is applied to the table. All of the tables use the link styles from only 1 style sheet but all the other style rules are applied just not the link styles.

    I want to be able to format the style of all the links in each table by applying the style sheet to the whole table, not each individual link like is discribed in other solutions. I'm not lazy it is just that there will be more links than you can count on your hands and toes, it's called working smart not hard!

    Umm so yeah, after that lon winded explanation can any one:
    a) Understand the problem
    b) Help me with a solution

    Cheers, any help would be greatly appreciated!

  2.  

  3. #2
    Senior Member karinne's Avatar
    Join Date
    Dec 2003
    Location
    Aylmer QC Canada
    Posts
    1,607
    Member #
    4335
    Liked
    8 times
    how are you calling the styles for earch table?

    here's what i would do

    css
    Code:
    #table1 {
      style for table 1
    }
    
    #table1 a, #table1 a:link... {
      style for links under table 1
    }
    
    #table2
    ....
    html
    Code:
    <table id="table1"><tr><td><a href="...">link</a></td></tr></table>
    
    <table id="table21"><tr><td><a href="...">link</a></td></tr></table>
    if you have stylesheet1.css with a, a:link...{...} and stylesheet2.css with a, a:link...{...} , the first style it find it will apply.

    for this you need to use ID and CLASS

    hope this wasn't too much chinese!
    [a web design portfolio - Currently NOT AVAILABLE for work | web design | Re-coding | PSD-to-HTML]
    I'm also on: virb - facebook - twitter - flickr - del.icio.us

  4. #3
    Senior Member glyakk's Avatar
    Join Date
    Nov 2003
    Location
    USA
    Posts
    1,263
    Member #
    3828
    Liked
    6 times
    BINGO!!

    give your tables different id's (or classes if you wish) and when you reference your links in your style sheet as karinne stated (#table1 a:link) everything will be gravy. no need to have multiple linked style sheets that sorta defets the purpose of style sheets if you are going to link more then one or maybe two.

    I think you are under the impression that you can link a style sheet to a table.. it does not work that way. You can only link a style sheet to a document and then call rules to different elements in that document from your style sheet.

    BTW: #table1 a:link means is all external hyperlinks in your table given the id="table1" will have this style applied to it. So with css you can pinpoint elements no matter how far down they go.. you could in essense have #table1#table1nested a:link:hover witch would point to an external hyperlink when you are hovering over it inside of a nested table( id="table1nested" ) inside of another table(id="table1 )



  5. #4
    Member
    Join Date
    Feb 2004
    Posts
    76
    Member #
    4909
    Xheers karinne, not so much chineese but more gibberish I'm but a simple designer not ha hardcore code geek :P

    Thanks glyakk for explaining it a bit better. I have found linking a style sheet to a table does work in a kind of half arsed way... sort of. I have about 3 style sheets to format the whole style of the site, I just use seperate style sheets to format different parts of the site and use rules in those 3 sheets to format elements, so yeah anyway I guess evereybody designs differently.

    Big ups to you both I'll let you know how it goes if I have any more problems.

  6. #5
    Member
    Join Date
    Feb 2004
    Posts
    76
    Member #
    4909
    Cheers karinne n glyakk it worked a treat. Big ups to you both what would I do with out you both?

    and glyakk you will be happy to know i am using one file sheet

  7. #6
    Senior Member karinne's Avatar
    Join Date
    Dec 2003
    Location
    Aylmer QC Canada
    Posts
    1,607
    Member #
    4335
    Liked
    8 times
    glad to see you got it workin'
    [a web design portfolio - Currently NOT AVAILABLE for work | web design | Re-coding | PSD-to-HTML]
    I'm also on: virb - facebook - twitter - flickr - del.icio.us

  8. #7
    Junior Member
    Join Date
    Apr 2005
    Posts
    23
    Member #
    9543
    Hi I like the approach used here, I also want to have several link styles depending on the section of the page.
    But while the :hover attributes display just fine the :link font styles don't get applied when I display them in the browser IE. In Dreamweaver itself it displays just fine. If anyone css savvy could look my code over that would be awesome.

    this is my external css:
    Code:
    #nav a.button {
    
    width: 100%;
    height: 31px;
    padding-left:37px;
    border-top: 3px solid #ffffff;
    border-bottom: 3px solid #ffffff;
    background-color:#FFFFFF;
    }
    #nav a:link {
    font-family: Trebuchet MS, Verdana, Tahoma, Arial, sans-serif;
    font-size: x-small;
    color: 055c23;
    text-transform: uppercase;
    text-decoration: none;
    }
    
    #nav a.button:hover {
    border-top: 3px solid #D4D2B4;
    border-bottom: 3px solid #D4D2B4;
    
    }
    this is how I apply it to my html doc:

    Code:
    <table id="nav">
    <tr> 
    <td>
    <a href="test.htm" class="button">some text</a></td>
    </tr>
    </table>


Remove Ads

Posting Permissions

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

Search tags for this page

multiple linkstyles on same page

Click on a term to search for related topics.
All times are GMT -6. The time now is 11:52 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com