Dreamweaver MX Question - Link Color

ParLawGod · 07-24-2007, 10:32 PM

Hi - I have a question regarding Dreamweaver MX. My website - http://www.jeremiaheis.com/ - has all white links (I think it's because that's what the CSS template calls for) so whenever I try to make NON-WHITE links in the right table of my website it shows up white!

Is there any way to override this so I can use non-white links??? This is driving me crazy!

Thanks!

webprofession · 07-25-2007, 04:27 AM

You gave white color to <a> tag in CSS
and you want the link with non-white color in somewhere on page,
right?

So, use this
<a href=...><font color=othecolor>Link</font></a>
insead of
<font color=othecolor><a href=...>Link</a></font>

Check your code.
This might be a solution of your problem.

ParLawGod · 07-25-2007, 09:59 PM

Hi - I honestly have no idea how to do that edit so I can have two different color links (I'm not that advanced). Any way to remove that from the CSS so I can just use whatever color whenever I want?

Costin Trifan · 07-26-2007, 04:52 PM

The CSS:

Quote:

A.ColorLink:link {
color: #FFA500; /* Orange */
}
A.ColorLink:visited {
color: #003300; /* Green */
}
A.ColorLink:hover {
color: #FF0000; /* Red */
}

The HTML:

Code:


<body>

<a class="ColorLink" href="#">Your new link here</a>

</body>

hope this make sense to you

thegamerslink · 07-30-2007, 03:02 PM

Highlight one of the links, then right click the mouse on top of the link.......you should see a selection for CSS Styles in the list.....Mouse over that, another side menu comes up, go down to new css style.......That will cause a box to pop up, the first space in the box is the selector so for regular links you would choose a:link you then can at the bottom decide whether it's changed in the imported css file or just on that page, choose according to your desire, click ok, and you will have all the different selections for you to make, including color. I think I'm right on this........

ParLawGod · 07-31-2007, 03:14 AM

Quote:

Highlight one of the links, then right click the mouse on top of the link.......you should see a selection for CSS Styles in the list.....Mouse over that, another side menu comes up, go down to new css style.......That will cause a box to pop up, the first space in the box is the selector so for regular links you would choose a:link you then can at the bottom decide whether it's changed in the imported css file or just on that page, choose according to your desire, click ok, and you will have all the different selections for you to make, including color. I think I'm right on this........

Unfortunately I couldn't get that to work...

I seem to be in a pickle here - whatever I seem to do doesn't work...I think I have reached the limit of my limited abilities...

ParLawGod · 07-31-2007, 03:40 AM

Well, what I was finally able to do (after re-reading this post several times, doing searches online, and dabbling with Dreamweaver and WordPad) I just ended up re-writing the .CSS (never did that before, learned quite a bit by trial and error I'm happy to say) and I just took the link color completely out of the .CSS (which I wasn't able to do before because I couldn't figure it out). I got it working on my computer very nicely. I'll be sure to repost once I am able to get the different color links throughout my site and get it online.

Thanks for your help everyone - it is greatly appreciated!

ParLawGod · 08-01-2007, 04:26 PM

My site is updated and the new link colors work - feel free to check it out (feedback is always appreciated).

Thanks!

Jrw2868 · 08-01-2007, 08:57 PM

Hey everyone,

I've been lurking for a bit and got the inspiration to join based on this post. I'm having the same problem as ParLawGod is having: most of my site has blue links, but there's one section I want to have white links.

The weird thing is this: I somehow got my links to be white (NO idea how I did this) but when I preview the site in browsers, the underline that pops up beneath the white links when my mouse hovers is blue--just like the blue links.

I figure it has something to do with the CSS code, but I can't figure what. So what I'm gonna do is just post my CSS code here. I think the relevant area is the h1 and the h2. If some awesome, phenomenal saint of a person could give me some idea of what code to put in and where to put it, I would love them forever. In a purely platonic sense, of course.

Thank you!!!
--Jen

* {
margin: 0;
padding: 0;
}

body {
background: #333 url("images/back.gif") repeat;
text-align: center;
font: normal 11px/18px verdana, arial, tahoma, sans-serif;
color: #333;
padding-top: 40px;
}

a {
color: #666;
text-decoration: none;
}

a:visited {
text-decoration: underline;
}

a:hover {
color: #ccc;
}

#header {
width: 580px;
height: 210px;
background: #000 url("images/PhillySkyline.jpg") no-repeat;
background-position: top right;
}

#wrapper {
width: 580px;
background: #fff url("images/sidebar.gif") repeat-y;
background-position: 0 0;
border: solid 10px #fff;
margin: 0 auto;
text-align: left;
}

h1 {
width: 140px;
height: 30px;
background-color: #333;
margin: 1px 1px 1px 0;
float: left;
font: bold 16px/30px arial, verdana, tahoma, sans-serif;
padding-left: 10px;
color: #fff;
cursor: default;
}

h1:first-letter {
color: #f00;
text-decoration: underline;
}

h2 {
width: 419px;
height: 30px;
background-color: #333;
float: left;
font: 16px/30px arial, verdana, tahoma, sans-serif;
padding-left: 10px;
color: #fff;
margin-top: 1px;
cursor: default;
}

#nav {
list-style: none;
z-index: 2;
border-right: 1px solid #fff;
height: 210px;
width: 150px;
}

#nav li a {
color: #fff;
font: normal 11px/24px verdana, arial, tahoma, sans-serif;
display: block;
width: 140px;
height: 24px;
background-color: #000;
border-bottom: 1px solid #fff;
padding-left: 10px;
text-decoration: none;
}

#nav li a:hover {
background-color: #333;
}

#current a {
background-image: url("images/bullet.gif");
background-repeat: no-repeat;
background-position: 100% 50%;
}

#sidebar {
width: 132px;
background-color: #ccc;
float: left;
position: relative;
left: -4px;
margin-left: -147px;
border-top: 1px solid #fff;
font: normal 10px/18px verdana, arial, tahoma, sans-serif;
padding: 8px;
}

img {
border: none;
}

a img {
margin-bottom: 20px;
border: 1px solid #fff;
}

a:hover img {
border-color: #f00;
}

#content {
float: left;
width: 400px;
margin: 10px 0 0 10px;
}

p {
margin-bottom: 20px;
}

#footer {
text-align: center;
clear: both;
width: 400px;
margin-left: 163px;
}

Costin Trifan · 08-02-2007, 03:50 AM

I've been explaining how to set up a link to have different colors a few posts above you change link color.

All you have to do is change it accordingly to your color palette.

Note:
Even if I have in a page something like:
UL LI A:link {.......}
I would still define a class for my links:
UL LI A.NewLink:link {.......}

That's because sometimes, depending on the browser used to display the web page your links definition gets messed up...(don't ask me why

)

hope this helps you

**ToddW** · 08-03-2007, 07:24 PM

Quote:

Originally Posted by Costin Trifan

I've been explaining how to set up a link to have different colors a few posts above you change link color.

All you have to do is change it accordingly to your color palette.

Note:
Even if I have in a page something like:
UL LI A:link {.......}
I would still define a class for my links:
UL LI A.NewLink:link {.......}

That's because sometimes, depending on the browser used to display the web page your links definition gets messed up...(don't ask me why

)

hope this helps you

FF and IE display this stuff differently, and FF and IE display CSS differently even too!!! It's insane.

Costin Trifan · 08-03-2007, 09:39 PM

Quote:

FF and IE display this stuff differently, and FF and IE display CSS differently even too!!! It's insane.

I fully agree with you

Try to design a website to display correctly in IE, FF and Opera ---> uuggghhh... this is crazy!!

but:

Quote:

A.NewLink:link {
color: Red;
text-decoration: none;
}

A.NewLink:visited {
color: Blue;
text-decoration: none;
}

A.NewLink:hover {
color: Green;
text-decoration: underline;
}

all browsers wil display this correctly. I've tested it so many times...
When this A:link and so on... is used more than once in a webpage, in that form, there's more chances to get your code messed up...

that's why I define classes for all the links I have if I need to decorate different some of them...