Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

CSS not working again on links?

Explorer ,
Jan 26, 2017 Jan 26, 2017

I am trying to edit the code for a link so that it's underlined as standard, and when the mouse is put over the 'hover' function changes to text decoration none.

I had this sorted last year, the plugin theme has been updated and it's defaulted to the reverse again. I can find the style sheet and looks like it should be behaving correctly? But it's not?

My site is http://menergy.org.au/committee-2016/  and believed the style sheet was located at  /public_html/wp-content/themes/Total/style.css, can anyone point me in the correct direction?

Thanks

Batch

1.8K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 26, 2017 Jan 26, 2017

Have a look at style.min.css Line 17 which says

.team-flat .team-item a {

  text-decoration-line: none;

  text-decoration-style: solid;

}

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 27, 2017 Jan 27, 2017

Ben, thanks for the reply.

I'm unable to find the code on line 17? The code for /* links */ is on line 638?

I need the link to be underlined and on hover to disappear. I'm sure it should read

/* links */

a { color: #0081cc; text-decoration: underline; outline: none; }

a:hover { text-decoration: none

Thanks

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 27, 2017 Jan 27, 2017

This is what I see

Edit:

I have un-marked by previous answer as being the correct answer. You can apply the correct answer when your problem has been solved.

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 27, 2017 Jan 27, 2017

Ben, that's not the style sheet for the specific element, I changed the CSS to read

.team-flat .team-item a {

    text-decoration: underline;

    }

 

.team-flat .team-item a:hover {

    text-decoration: none;

    }

it didn't work?

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 27, 2017 Jan 27, 2017

Which links are you talking about that you want underlined as standard?

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 28, 2017 Jan 28, 2017

The links are in the text, at various places.

To bring my vision into the world I have co-founded ‘The Art of Relating’ where one focus’ ‘EmpowerMENt’ is specifically to support MEN in feeling and connecting more deeply with themselves. My monthly offering ‘MEN@Dance’ provides an embodiment space; a moving meditation that is centering, grounding and empowering.

On this page they behave in the opposite way.

Thanks

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 28, 2017 Jan 28, 2017

Paul, this is the markup

<div class="team-item" >

  <div style="max-height:10000px;" class="team-thumb"><img src="http://menergy.org.au/wp-content/uploads/2015/08/Gero-2016.jpg" /></div>

  <div class="team-title" style="color:#333;font-size:14px">Gero</div>

  <div class="team-position" style="color:#333;font-size:13px">The Connector</div>

  <div class="team-content" style="color:#333;font-size:13px;">

  <p>I am a journeyman….continuously looking to learn, to understand and to grow my experience base. In my younger years I often felt inadequate; not good enough, not attractive enough. I wanted to be someone else, someone better and I longed to be loved and accepted by others. This mindset presented a considerable obstacle to finding myself yet I am able to appreciate more and more what I have found. Today, I aspire to live in the now, being present to what is and response-able to what comes.<br />

  Creating possibilities for authentic interactions is what fuels my passion. I want to contribute to an alive, just and sustainable future and I am inviting feedback from those around me on how I am doing.<br />

  To bring my vision into the world I have co-founded <a href="http://www.theartofrelating.com.au/" target="_blank">‘The Art of Relating’ </a>where one focus’ ‘EmpowerMENt’ is specifically to support MEN in feeling and connecting more deeply with themselves. My monthly offering <a href="https://www.facebook.com/groups/1490351944582419/" target="_blank">‘MEN@Dance’</a> provides an embodiment space; a moving meditation that is centering, grounding and empowering.</p>

This means that the selector could be .team-item a

When I then look at my reply (#3) I see

.team-flat .team-item a {

  text-decoration: none

  }

This cannot be a co-incidence.

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 28, 2017 Jan 28, 2017

Ben, I have changed the style sheet to read:-

.team-flat .team-item a {

    text-decoration: underline

    }

 

.team-flat .team-item a:hover {

    text-decoration: none

    }

saved the sheet, cleared my cache (Firefox) and it still doesn't behave? What am I missing?

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 28, 2017 Jan 28, 2017

There may be other rules that come after the rules that you have changed, thus overriding them.

Try adding !important as in

.team-flat .team-item a {

    text-decoration: underline !important;

    }

.team-flat .team-item a:hover {

    text-decoration: none !important;

    }

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 28, 2017 Jan 28, 2017

Just re-reading your reply #4, If you are using Chrome to test, you may find a problem with the cache, which means that changes made in CSS may not filter through.

See here for more Clear cache and cookies - Accounts Help

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 30, 2017 Jan 30, 2017

Hi Ben

Apologies for the delay.

I have changed the file as above, refreshed cache and deleted cookies, still not working?

😞

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jan 31, 2017 Jan 31, 2017

You have an id tag available - id="team-207" - which is greater than a class tag, so make use of it to target the anchor tags within the text and see if that resolves your issues:

#team-207 a {

color: red;

text-decoration: underline;

}

#team-207 a:hover {

text-decoration: none;

}

Although the answer that Ben provided should work - using !mportant - it does for me.

23 stylesheets! No wonder you cant get anything to work. Do you know exactly what is in all of these stylesheets?

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 31, 2017 Jan 31, 2017

I have changed the code to reflect your response and included the !important also

It still doesn't work?

The stylesheets are all related to the plugins and themes, I would prefer to have less?

thanks for the help so far

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 31, 2017 Jan 31, 2017

I removed the 'Correct Answer' label from my reply because that answer did not solve the problem.

Then I took to Firefox and used one of the nifty tools within the Web Developer extension to modify relevant style rules. This is the result

For more on the tool used, see Web Developer

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 31, 2017 Jan 31, 2017

Ben, most confusing!

I have changed the code on the style sheet, deleted my cache and cookies as per

.team-flat .team-item a {

    text-decoration: underline !important;

    }

.team-flat .team-item a:hover {

    text-decoration: none !important;

    }

and yet it's not working?

I'm about to just accept?

Thanks

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Feb 01, 2017 Feb 01, 2017
LATEST

I'm not sure why its not working for you. Both the solution I supplied plus the one Ben supplied works for me when I test it out.

As a last resort insert the code below into the page DIRECTLY before the closing </head> tag and try that.

<style>

#team-207 a {

color: red;

text-decoration: underline;

}

#team-207 a:hover {

text-decoration: none;

}

</style>

It may be that something else in one of your 23 stylesheets is over-ridng the styling. It's difficult to diagnose the issue when so many stylesheets are used.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines