Removing underlines in Sigil/conflicts with sgc-#?
 

Hi all

I have been trying to figure this out for ages, but had no luck, so thought I should ask the experts.

I have generated an ePub file from InDesign CS5.5. I then run it into Sigil to do some tweaking.

I wanted to try and remove the underlines from internal hyperlinks within the file. I have tried text-decoration:none on the relevant CSS, but still no changes.

I then discovered the span classes than Sigil inserts (sgc-#). Thinking this may be causing the problem, I also inserted text-decoration:none into the html header alongside the inline styles for sgc. Still this didnt remove the underlining.

Does anyone have any idea of other things I could try?

Many thanks in advance
Dan

Turn off tidy. It will stop generating those sgc-# styles that should not be there.

Hi JSWolf

Thanks for that, I turned off tidy and it did remove the sgc tags.

However, those underlines are still remaining. Can you think of anything I could do to remove the underlinings?

Thanks

Were the underlines in the ePub before it was loaded into Sigil?

Yes, they were in place before it came into Sigil.

How are the underlines coded?

Do you mean in Sigil?

The ePub was generated in InDesign originally

Please post a sample of the code with an underline.

'See example texts on 119' is the underlined text.

<span class="Hyperlinks" style="font-size:1em;">See Example texts on</span> <span class="Hyperlinks" style="font-size:1em;">119</span></a></p>


and the Hyperlinks CSS it refers to is:

span.Hyperlinks {
font-family : "Sabon MT Std", serif;
font-weight : normal;
font-style : normal;
font-size : 0.92em;
text-decoration : none;
font-variant : normal;
color : #000000;}

and Malformed Anchor to boot
Anchors are links
Links get underlined by default
the <a
takes precedence over your span

Thanks for this.
This is the full section of code. Does this still look wrong?

<p class="examples_texts_ref"><img alt="example_texts.jpg" class="image" src="../Images/example_texts_fmt.jpeg" width="7%" /> <a id="See-Example-Texts_Celebrity-84"></a><a href="../Text/insides_52_kindle-60.html#Example_texts_Geocaching"><span class="Hyperlinks" style="font-size:1em;">See Example texts on</span> <span class="Hyperlinks" style="font-size:1em;">119</span></a></p>

a { color: black; text-decoration: none; }

make all anchors Black and no underline

You have a space in between the two identical spans which may be causing it to put the underline from the <a> tag. Remove the duplicate span like this:

<a href="..."><span class="Hyperlinks" style="font-size:1em;">See Example texts on 119</span></a></p>

Personally I don't like putting an extra span inside of another tag when you can just apply the style to the tag itself, like this:

<a href="..." class="Hyperlinks" style="font-size:1em;">See Example texts on 119</a></p>

or even more compact - just style the <a> tag itself in the css:

a {font-family : "Sabon MT Std", serif;
font-weight : normal;
font-style : normal;
font-size : 0.92em; 1em;
text-decoration : none;
font-variant : normal;
color : #000000; inherit}

<a href="...">See Example texts on 119</a></p>

Thanks!
Do you mean to do this inline, or in the head of the html, or in the css?

Dang...I got ninja'd by 3 posts!!! must be a slow-typing day!

I like to use "inherit" in my link color so the links don't disappear if the reader chooses "night mode"...the link will stay whatever color the normal text is...