Styles when viewing HTML

[Guest]

Hi there.

I am styling some links that are in a table using the default.css file.

When i first add the link, it uses my style, but if I switch to the HTML view, and then switch back to design view, different style properties have been added to the link in the HTML, and it doesn't appear how I want it to.

Is there something I'm doing wrong?

Craig

[Willam_van_Weelden]

Hi,

What version of RH are you using?

Also, how do you style the links, do you add several attributes or do you add the attribute style? Please be very specific of what you do and what RoboHelp changes.

Greet,

Willam

[Guest]

Hi there.

Thanks very much for the reply.

I'm using version 8 of the software.

I use the external stylesheet (default.css), and then I add bits where I need to (or think I need to anyways).

The bit I'm struggling with at the minute is:

I've inserted a table and chose the AlternateBlueWithHeader style.

This created various properties in the css file.

Within the table, I added text that I then went on to add drop down effects to.

This gives the text a attribute "a class="dropspot"

So in my CSS file, I've tried adding things like

table.AlternateBlueWithHeader tr.t1row td A.dropspot {
    cursor: hand;
    color: #FF0000;
    font-style: none;
    text-decoration: underline;
}
table.AlternateBlueWithHeader tr.t2row td A.dropspot {
    cursor: hand;
    color: #FF0000;
    font-style: none;
    text-decoration: underline;
}

It seems to have picked up these properties, but when I switch to the HTML tab, and then back to Design, it changes it and adds this property in the html in the a class.

style="color: #0000ff; text-decoration: underline;

Does that help at all?

Thanks,

Craig

[Willam_van_Weelden]

Hi,

This is indeed something strange, my copy of RH8 also inserts the style attribute in some links. (Allways in tables).

First things first,

1. cursor: hand is not a valid value Replace by cursor: pointer. The hand value is a relic from when IE sucked even more... Since the style is also the standard style for links, you can remove it (unless you specifically need this style).

2. font-style: none;  is not a valid value. Replace by font-style: normal;. (I guess you want the text to be normal and not italic or the like.)

3. You have a long selector. Do you really need this much selectors? I think you can omit td without any problems. Also, you target tr.t1row and tr.t2row separately. Do you only want to style dropdown links inside these rows, or do you want to style all dropdowns inside the tabel AlternateBlueWithHeader? In the last case, change the selecter to table.AlternateBlueWithHeader a.dropspot. You then only need one style definition.

After this, does RH still insert the inline styling? If so, you can overwrite the inline styling from your css. Add !important behind the style definitions and before the ;, such as:

color: #FF0000 !important;

If RH still inserts the styling, this may very well be a bug. The above solution is only a workaround to get your styles showing as they should.

Greet,

Willam

[Guest]

Hi, and thanks for the quick reply.

I added the following to my CSS file as I want all the dropspots in the table styled the same, as you suggested.

table.AlternateBlueWithHeader a.dropspot {
    color: #FF0000;
    font-style: normal;
    text-decoration: underline;
}

Created a new line of text and added the dropdown effect.

Switched to the preview and html, and it added its own inline styling.

I added the !important to overwrite the inline and this seems to have worked.Is it ok to use this workaround then or will it cause me any other issues?

Thanks very much for your help.

[Willam_van_Weelden]

Hi,

The woraround will not cause issues, unless you want to use inline styling. You will then have to use the !important in your inline style.

You should allways use the !important statement with care. It is very usefull for overwriting inline styling, but it can also overwrite the settings of your user's browser. Say that you set p {font-size: 3pt !important;} while a user has the standard paragraph size set to 40 points. (This is not the standard text size, but a different user setting.) Using !important to set the color of a hyperlink right, is no big deal. Just try to avoid it as much as possible.

For more information, see http://www.w3.org/TR/CSS2/cascade.html#cascade

Greet,

Willam