Having two styles of link in same stylesheet

Discussion in 'HTML' started by Sally Thompson, Mar 4, 2004.

  1. I've been working on a website for my brother (yeah, I'm no expert but
    I'm free!) and have "borrowed" one of Brucie's samples for the menu,
    which is absolutely fine. However, I'm having trouble providing other
    links elsewhere which do not have a border. I can change the colour
    of the text and, can underline it, no problem, but cannot get rid of
    the box effect and just don't know what I'm doing wrong. I have
    followed the instructions in the CSS tutorial in
    <http://www.pmob.co.uk/faqcss/tutorial1.htm>, trying both the version
    setting a class for the style definition for the links, and also using
    a separate <div> tag, but whatever I do I still have the box - and
    very often completely screw up the original menu as well (I think
    depending on where I put the code in my style sheet). I have, by the
    way, included {border: none;}. so that the code reads (eg):

    a.different:link {
    color: #00008B;
    background-color: transparent;
    text-decoration: underline;
    border: none;
    border-width: 0; }

    Then putting in the body:
    <p><a class="different" href="mailto:">
    </a></p>

    I have taken out all these trials for now since none of them worked,
    but you can see the test page at
    <http://stonybrook.users.btopenworld.com/johntest.html>
    and the CSS at
    <http://stonybrook.users.btopenworld.com/johntest.css>.
    Only one of the links works at present - the one entitled "Degassing
    System".

    As well as displaying the email address more conventionally, I want to
    put some small text links along the bottom of the page, but this is
    driving me mad!

    --
    Sally in Shropshire, UK
    bed and breakfast near Ludlow: http://www.stonybrook-ludlow.co.uk
    Email is sallydogthompsonatbtinternetdogcom, replacing dog with dot
    Reply To address is spam trap
     
    Sally Thompson, Mar 4, 2004
    #1
    1. Advertising

  2. Sally Thompson

    spaghetti Guest

    On Thu, 04 Mar 2004 22:32:18 GMT, Sally Thompson
    <> wrote:

    > As well as displaying the email address more conventionally, I want to
    > put some small text links along the bottom of the page, but this is
    > driving me mad!


    Sounds like you're having some troubles understanding how CSS "selectors"
    work. Currently you use this selector for the rules to put the border
    around the links:

    a, a:visited

    What you're saying here is "apply this to ALL the <a> elements on the
    page, and all the <a> elements that have been visited."

    We want it to say "apply this to all the <a> elements that are inside a
    specific element." So put an id="menu" or some other unique identifier in
    the <div> around your menu links, and then change your rule to something
    like this:

    #menu a, #menu a:visited

    This says "apply this to all <a> elements that are a child of an element
    that has an ID of 'menu'."

    And that's it. Take a quick look at
    <http://www.w3.org/TR/REC-CSS2/selector.html> to get the full story on CSS
    selectors, but keep in mind that quite a few of those selector styles
    don't work in IE.
     
    spaghetti, Mar 5, 2004
    #2
    1. Advertising

  3. On Fri, 05 Mar 2004 00:25:28 GMT, spaghetti <>
    wrote:

    >On Thu, 04 Mar 2004 22:32:18 GMT, Sally Thompson
    ><> wrote:
    >
    >> As well as displaying the email address more conventionally, I want to
    >> put some small text links along the bottom of the page, but this is
    >> driving me mad!

    >
    >Sounds like you're having some troubles understanding how CSS "selectors"
    >work. Currently you use this selector for the rules to put the border
    >around the links:
    >
    >a, a:visited
    >
    >What you're saying here is "apply this to ALL the <a> elements on the
    >page, and all the <a> elements that have been visited."
    >
    >We want it to say "apply this to all the <a> elements that are inside a
    >specific element." So put an id="menu" or some other unique identifier in
    >the <div> around your menu links, and then change your rule to something
    >like this:
    >
    >#menu a, #menu a:visited
    >
    >This says "apply this to all <a> elements that are a child of an element
    >that has an ID of 'menu'."
    >
    >And that's it. Take a quick look at
    ><http://www.w3.org/TR/REC-CSS2/selector.html> to get the full story on CSS
    >selectors, but keep in mind that quite a few of those selector styles
    >don't work in IE.


    Thank you so much for the clear explanation. I'll try this change
    later, and you are quite right - I don't fully understand! All my CSS
    has been learnt from online tutorials, this and other newsgroups, and
    a small amount from the Elizabeth Castro book, but I think I really
    need a good reference book as well.

    --
    Sally in Shropshire, UK
    bed and breakfast near Ludlow: http://www.stonybrook-ludlow.co.uk
    Email is sallydogthompsonatbtinternetdogcom, replacing dog with dot
    Reply To address is spam trap
     
    Sally Thompson, Mar 5, 2004
    #3
  4. spaghetti wrote:
    > On Thu, 04 Mar 2004 22:32:18 GMT, Sally Thompson
    > <> wrote:
    >
    >> As well as displaying the email address more conventionally, I want
    >> to put some small text links along the bottom of the page, but this
    >> is driving me mad!

    [snip]
    > We want it to say "apply this to all the <a> elements that are inside
    > a specific element." So put an id="menu" or some other unique
    > identifier in the <div> around your menu links, and then change your
    > rule to something like this:
    >
    > #menu a, #menu a:visited
    >
    > This says "apply this to all <a> elements that are a child of an
    > element that has an ID of 'menu'."

    [snip]

    Descendent (or contextual). But you are right to suggest it for this case,
    because it is probably more appropriate than child.

    Child would be
    #menu > a ....

    --
    Barry Pearson
    http://www.Barry.Pearson.name/photography/
    http://www.BirdsAndAnimals.info/
    http://www.ChildSupportAnalysis.co.uk/
     
    Barry Pearson, Mar 5, 2004
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. sasquatch
    Replies:
    0
    Views:
    450
    sasquatch
    Nov 20, 2005
  2. sasquatch
    Replies:
    7
    Views:
    14,421
    Juan T. Llibre
    Nov 21, 2005
  3. =?ISO-8859-1?Q?J=F8rn_Tommy_Kinder=E5s?=

    Stylesheet referanse i stylesheet

    =?ISO-8859-1?Q?J=F8rn_Tommy_Kinder=E5s?=, Jul 3, 2004, in forum: XML
    Replies:
    3
    Views:
    591
    =?ISO-8859-1?Q?J=F8rn_Tommy_Kinder=E5s?=
    Jul 4, 2004
  4. =?Utf-8?B?QWxleCBNYWdoZW4=?=

    Styles without Http Request for StyleSheet

    =?Utf-8?B?QWxleCBNYWdoZW4=?=, Jan 1, 2007, in forum: ASP .Net
    Replies:
    2
    Views:
    277
    Walter Wang [MSFT]
    Jan 2, 2007
  5. Ciaran
    Replies:
    3
    Views:
    142
    Ry Nohryb
    Aug 24, 2010
Loading...

Share This Page