CSS - Css Hyperlinks Only Have One Property
I'm pretty new to css but now use one css file for all of the formatting of my entire website. The only problem I see with that (I say problem because I can't figure out a way around it) is that all of my hyperlinks throughout the website have only one normal state, hover state, active state and visited state. Is there a way to make more than one hyperlink set of formats? Like if I wanted to make one for each page? I could do something like ahomepage:link, ahomepage:visited, ahomepage:active or something???
Code: a:link, a:visited, a:active { font-size:12px; font-weight:normal; font-family: times; text-decoration:none; color : #000000 } a:hover { font-size:12px; font-weight:normal; font-family: times; text-decoration:underline; color : #000000 } Similar TutorialsHi all, I am trying to automate everything on my test website and I have one more angle to cover. In effect, I want to adjust the line-height property (which I can do) based on the number of files within a specific folder (PHP and already done). The more files in the folder, the lower the line-height value must be. This is to ensure if I copy additional files into the folder, then the navigation menu (which is PHP reading files in this particular folder) will alter the CSS line-height property accordingly to ensure it can never exceed a certain height. Sounds wierd? go to www.re3.org.uk (next to the RE3 image, I have a list of hyperlinks which are obtained from files within the folder) My problem, when adjusting the CSS property (which is set as cm in *.css file) in javascript, it doesn't correspond correctly, the line-height property in javascript doesn't appear to be work in cm but some other measurement. Does anyone know how to change what unit of measurement Javascript works in? Or does anyone know what unit of measurement javascript uses when adjusting line-height / line-width values? I want to create a mini-algorithm that works out the appropriate line-height based on the image height (got that already) and the number of files in the folder (got that too) so the menu automatically adjusts to fit. Whew! Greetings, i have a question regarding CSS hyperlinks. Here's what one of my sheets looks like: ==================== a:link{text-decoration:none; color:#0000ff; font-weight:bold;} a:visited{text-decoration:none; color:#0000ff; font-weight:bold;} a:hover{text-decoration:none; color:#00ff00; font-weight:bold;} p.pic { position:absolute; left:275px; top:104px; } p.message { a:link{text-decoration:none; color:#0000ff; font-weight:normal;} a:visited{text-decoration:none; color:#0000ff; font-weight:normal;} a:hover{text-decoration:none; color:#00ff00; font-weight:normal;} position:absolute; top:475px; } ============================ i want the hyperlinks in "p.message" to display as normal text, NOT BOLDED like the hyperlinks in "p.pic" appear. What do i need to alter in this code to make this happen? i would like keep this all within one style sheet. Thanks for your time, Nick I want to have all my hyperlinks in my CSS file, so I can call them all at once. Is there any way to do this? Or do I have to code them into every page individually?? i currently have the following code for links.. Code: a { color:#666666; font-size:11px; text-decoration:none; font-weight:600; font-family: arial, helvetica, sans-serif; } a:link {color:#666666;} a:visited {color:#333333;} a:hover {background-color:#eee;} is there a way of having another set so that some have the colour settings as above and another set have the colour settings that are blue or something??? any suggestions would be great.... thanks RF Something has gone terribly wrong. I added a sub menu to one of my pages by creating a sub-unordered list and positioning it absolutely where I wanted it. Now only 1 of 7 of the hyperlinks actually works and even that one isn't lined up correctly. I'm not sure what is going on here. The page in question can be found here. I've gone over this a hundred times and can't find where the problem starts. Hi, I have created this menu: http://www.explosiveracing.net/test/header.html In IE the hyperlinks do not appear with the underline whereas in FF they do. How do I make FF not display the underline? Also in FF the 'boxes' are 'squashed' on top of each other whereas in IE there is a small gap. How do I keep the small gap in FF? The direct link to the css is: http://www.explosiveracing.net/test/css/menu.css Thanks Hi, I have a series of images that act as hyperlinks to other pages. I want the image border to initially be set to none, but when I rollover the image I want it to turn white, 1px wide. Tried doing this with normal link styles, but it ain't workin. So how do you do this? Thanks mM Is there such a thing as using an alt property for <img> tag? This would be awfully useful for SEO I'm trying to create some links that swap background images when you mouseover them. The non-CSS solution (which looks exactly how I want it to look) is located he http://84.9.221.75/domains/backingt...Musicindex.html My attempt at creating a CSS equivalent of those links is located on this page: http://84.9.221.75/domains/backingt...Musicindex.html I just need some help with the CSS I'm using on the latter page...I read up a little on how to do this, but it's obvious I'm still doing something wrong... I need the buttons and the text inside the buttons to line up and appear like they do in the first URL....can anyone give me some pointers here? Thank you. Thanks for all the continued help/support. . . Makes learning CSS so much easier! Link: www.vairlinecms.com Question: I set the html up like this on purpose to grasp the concept. <p> tags are block level containers. So each new set of <p> tags should equal start on new line. w/the float property holding a value of left, it floats all content to the left. Since each instance of float occurs in its own container...the two different <p> sets should not be affected. In short, the password: paragraph should be on a new line, not both on the same line. There should be no need to clear it because they are in their own containers - which are block level. Where is my logic/understanding of CSS flawed? HTML: Code: <div id="clientLoginBoxBody"> <form action=#"> <br /> <p class="user">Username:</p> <p class="pass">Password:</p> </form> </div> CSS: Code: #clientLoginBoxBody p.user, p.pass { float: left; margin: 0; margin-left: 10px; padding: 0; font-size: 12px; text-align: right; } Question: I have two class below. What I want is when I change the padding-top property value in div.content-full, I also want the padding-top property value in the div.content change to the same value div.content-full { float:left; width:100%; padding-top:10px; margin:0px; } div.content { float:left; width:70%; padding-top:06px; margin:0px; } Can anybody help me out? I am trying to figure out how I can get this red curve to align to the bottom of the page, while also being able to move up and down with the size of the browser window. http://www.woodrichwebworks.com/psa/psa_comps/bycor/html/redtest.html Any help would be great. This style is use useful or not @property-group title-style() { color: #004080; font-weight: bold; } @property-group standard-vmargins() { margin: 1.33ex 0; } title, subtitle, titleabbrev { display: block; property-group: title-style(); property-group: standard-vmargins(); } This is not support IE... My documentation for css shows that content: url(); works in navigator but not in ie. The info I've got is dated. Does the content property work in the newer ie browsers? Hi all, I've got problm in css Listbox properties, I put list box within a normal html .. and there are 3 option to list like this.., 1.name 2.Address of a person 3.Phone no: resident so i give width=80px; in css and it will show the list box width correctly. but drop down part also the same width . so i want to expand the width as when we entered option text width. how can i achieve this ? pls help me......! Prachalitha Will the -moz property ever become a valid CSS property. when I validate my CSS on w3.org I get errors. I remove all propertys that have a -moz in front of it and it is 100% valid. ALSO ... Is there a way to mask parts of the css from the validator or have a separate CSS file that can be masked from the validator to make it appear to be 100% valid.. Thanks Hi, i am very new to css and I am confused about the difference between margin-top vs top please help Regards Ltoso Ok what i want to happen is that when person clicks on a link i want a div to appear/be visible underneath that link. But i want that div to not take any space unless i click on a link. I recently did something similar BUT the div was taking the space but was just hidden. I am wondering if there is some way to make a <div> layer automatically expand to the full height of the screen similar to the way that one would use width=100% when talking about the width of a page. I have a layer that I want to extend to the bottom of the page no matter what resolution the user has on their screen. Maybe the layer could just extend all the way until the next layer? Any Ideas? Thanks Jamie |