bicyclegirl Posted August 5, 2009 Share Posted August 5, 2009 I am a newbie to it all so don't get very technical yet...I've created a layout that includes a navBar external css class=".nav"and a hyperlink styled with external css class="span.mailto". Now my nav bar is using the css styling meant for the span hyperlink. My navBar is supposed to be no margin and the link,visited and hover are set at left-90px, right-40px but it's not responding...helphere's the css for each element.navigation{background-color:#163181;margin-left:0px;margin-right:0px;}a:link{font-family:Arial;font-size:.85em;color:white; text-decoration: none; margin-left:90px;margin-right:40px;}a:visited{font-family:Arial;font-size:.85em;color:yellow; text-decoration: none;}a:hover{font-family:Arial;font-size:.85em;color:orange;text-decoration: none;}span.mailtoa:link{ color:orange;text-decoration: none;margin:6px;}span.mailtoa:hover{color:white;}here's the html for each as well<div class="navigation"><a href="index.html">Home</a> <a href="everydayPhotos.html">Everyday</a><a href="photoArt.html">Photo Art</a> <a href="restoration.html">Restoration</a> <a href="about.html">The Artist</a> <a href="linksPage.html">Links</a></div><span class="mailto"/><a href="mailto:notmyrealone@gmail.com">Email</a> Link to comment Share on other sites More sharing options...
thescientist Posted August 5, 2009 Share Posted August 5, 2009 is this an external stylesheet you are using? are you calling it within the HTML page itself somewhere? Link to comment Share on other sites More sharing options...
bicyclegirl Posted August 5, 2009 Author Share Posted August 5, 2009 is this an external stylesheet you are using? are you calling it within the HTML page itself somewhere?thanks for replying...and sorry I was gone for a while so just now saw your note.yes this is an external css and it is linked to my html page. the span is only on one html page of a 6 page layout. the navigation bar is on all 6 html pages Link to comment Share on other sites More sharing options...
bicyclegirl Posted August 5, 2009 Author Share Posted August 5, 2009 thanks for replying...and sorry I was gone for a while so just now saw your note.yes this is an external css and it is linked to my html page. the span is only on one html page of a 6 page layout. the navigation bar is on all 6 html pagesbtw... the span is near the end of a paragraph... Link to comment Share on other sites More sharing options...
bigsilk Posted August 5, 2009 Share Posted August 5, 2009 I am a newbie to it all so don't get very technical yet...I've created a layout that includes a navBar external css class=".nav"and a hyperlink styled with external css class="span.mailto". Now my nav bar is using the css styling meant for the span hyperlink. My navBar is supposed to be no margin and the link,visited and hover are set at left-90px, right-40px but it's not responding...helphere's the css for each element.navigation{background-color:#163181;margin-left:0px;margin-right:0px;}a:link{font-family:Arial;font-size:.85em;color:white; text-decoration: none; margin-left:90px;margin-right:40px;}a:visited{font-family:Arial;font-size:.85em;color:yellow; text-decoration: none;}a:hover{font-family:Arial;font-size:.85em;color:orange;text-decoration: none;}span.mailtoa:link{ color:orange;text-decoration: none;margin:6px;}span.mailtoa:hover{color:white;}here's the html for each as well<div class="navigation"><a href="index.html">Home</a> <a href="everydayPhotos.html">Everyday</a><a href="photoArt.html">Photo Art</a> <a href="restoration.html">Restoration</a> <a href="about.html">The Artist</a> <a href="linksPage.html">Links</a></div><span class="mailto"/><a href="mailto:notmyrealone@gmail.com">Email</a>Instead of finishing the <span...> within the carets, have you tried finishing the span outside the anchor closing? <span class="mailto"><a href="mailto:notmyrealone@gmail.com">Email</a></span> Link to comment Share on other sites More sharing options...
bicyclegirl Posted August 6, 2009 Author Share Posted August 6, 2009 Instead of finishing the <span...> within the carets, have you tried finishing the span outside the anchor closing? <span class="mailto"><a href="mailto:notmyrealone@gmail.com">Email</a></span>the problem is that the navBar now uses the span's css not it's own css. I'll try closing outside the spans anchor and see if that helps... Link to comment Share on other sites More sharing options...
SillyBilly Posted August 6, 2009 Share Posted August 6, 2009 Instead of finishing the <span...> within the carets, have you tried finishing the span outside the anchor closing? <span class="mailto"><a href="mailto:notmyrealone@gmail.com">Email</a></span>bigsilk, the symbol < or > is not a caret. Together they are angle brackets.Caret, sometimes spelled carat, is the name for the symbol ^ in ASCII and some other character sets. Its Unicode code point is U+005E, and its ASCII code in hexadecimal is 5E. The term "caret" is most frequently used to refer to a circumflex accent over a letter especially in French. It is also a mark used by an author or editor to indicate where something is to be inserted into a text. Link to comment Share on other sites More sharing options...
dsonesuk Posted August 6, 2009 Share Posted August 6, 2009 the nav_has no margins, the margins are are assigned to a:link but also cascade down to a:hover, and a:visited. Not exactly clear what you want, but if you want the margins width to change???, add margins to hover, visited and change size.My opinion if you want to equally space them out, give the navigation a a fixed width, which span equally across the menu bar, or instead of margins use padding: 0 30px; which will add 30px of padding each side of text.is the mailto span supposed to be within the navbar??see my coding below:.navigation{background-color:#163181;margin-left:0px;margin-right:0px;}.navigation a {font-family:Arial;font-size:.85em;text-decoration: none;padding: 0 30px;}.navigation a:link{ color:#FFF; }.navigation a:hover{color:orange;}.navigation a:visited{color:yellow;}span.mailto a{text-decoration: none;margin:6px;}span.mailto a:link{color:orange;}span.mailto a:hover{color:white;} Link to comment Share on other sites More sharing options...
bigsilk Posted August 6, 2009 Share Posted August 6, 2009 bigsilk, the symbol < or > is not a caret. Together they are angle brackets.Caret, sometimes spelled carat, is the name for the symbol ^ in ASCII and some other character sets. Its Unicode code point is U+005E, and its ASCII code in hexadecimal is 5E. The term "caret" is most frequently used to refer to a circumflex accent over a letter especially in French. It is also a mark used by an author or editor to indicate where something is to be inserted into a text.'bigsilk' forms a 'W' on his forehead with his hands, as to indicate 'whatever...'How about addressing the issue and not correcting me in a public forum.And if you are going to copy verbatim from another source, you should cite it. I found almost the same exact thing on Wikipedia:"Caret, sometimes spelled carat, is the name for the symbol ^ in ASCII and some other character sets. Its Unicode code point is U+005E, and its ASCII code in hexadecimal is 5E."-http://en.wikipedia.org/wiki/Caret Link to comment Share on other sites More sharing options...
bicyclegirl Posted August 7, 2009 Author Share Posted August 7, 2009 the nav_has no margins, the margins are are assigned to a:link but also cascade down to a:hover, and a:visited. Not exactly clear what you want, but if you want the margins width to change???, add margins to hover, visited and change size.My opinion if you want to equally space them out, give the navigation a a fixed width, which span equally across the menu bar, or instead of margins use padding: 0 30px; which will add 30px of padding each side of text.is the mailto span supposed to be within the navbar??see my coding below:.navigation{background-color:#163181;margin-left:0px;margin-right:0px;}.navigation a {font-family:Arial;font-size:.85em;text-decoration: none;padding: 0 30px;}.navigation a:link{ color:#FFF; }.navigation a:hover{color:orange;}.navigation a:visited{color:yellow;}span.mailto a{text-decoration: none;margin:6px;}span.mailto a:link{color:orange;}span.mailto a:hover{color:white;}well, what I wanted was that the bar itself stretch the width of my pages. the words on the navBar (home, about, etc, etc) was to begin 90px from the leftand have 40px of space between each word. I know they will not go across the whole page. the span is no longer an issue but now a new one has come up.... I have created a list on another page that is formatting itself using the navBar code.the nav and list both have <a href=.....> tags in them so I guess that is confusing the css.the list is in list form but giving the bullets a 90px left-margin, 40px between the bullet andlist item and using the navs colors. I tried putting the list in <div1 class="li">(the nav is <div class="nav") and still have trouble getting it to use it's own css. I thought the <div1> would do it. any suggestions?? Link to comment Share on other sites More sharing options...
bicyclegirl Posted August 7, 2009 Author Share Posted August 7, 2009 'bigsilk' forms a 'W' on his forehead with his hands, as to indicate 'whatever...'How about addressing the issue and not correcting me in a public forum.And if you are going to copy verbatim from another source, you should cite it. I found almost the same exact thing on Wikipedia:"Caret, sometimes spelled carat, is the name for the symbol ^ in ASCII and some other character sets. Its Unicode code point is U+005E, and its ASCII code in hexadecimal is 5E."-http://en.wikipedia.org/wiki/Caret bigsilk,I moved the closing span tag over as you suggested. it worked! :)thank you very much...now I have a new css issue with a listsee reply to 'dsonesuk'. Link to comment Share on other sites More sharing options...
dsonesuk Posted August 7, 2009 Share Posted August 7, 2009 you have to select the nav bar list itself, and change its anchor margins..navigation ul a{margin:0;} Link to comment Share on other sites More sharing options...
bicyclegirl Posted August 7, 2009 Author Share Posted August 7, 2009 you have to select the nav bar list itself, and change its anchor margins..navigation ul a{margin:0;}everything is working now... my thanks to all Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.