0

I am attempting to link some bootstrap html to an email address. I have managed to link it, and it works perfectly fine, but the text is black. I created a class (class="mail-text") with a color, and a hover color and after uploading the files to my server, works exactly how I want it to on my the Mac I'm working on with Safari.

Unfortunately on the same machine, the color is black when opened in Google Chrome, and when attempting to view the site on both my iPhone and iPad, it again shows in black.

I've tried all sorts, and googled frantically, but to no avail.

HTML

<div class="top-bar-area inline bg-theme">
        <div class="container">
            <div class="row">
                <div class="col-md-8 address-info text-left">
                    <div class="info box">
                        <ul>
                            <li>
                                <i class="fas fa-map-marker-alt"></i> Doncaster Road, Selby
                            </li>
                            <li>
                                <i class="fas fa-envelope-open"></i> <a class="mail-text" href="mailto:admin@swanbrayton.co.uk">admin@swanbrayton.co.uk</a>
                            </li>
                            <li>
                                <i class="fas fa-phone"></i> 07792 171188
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="col-md-4 social text-right">
                    <ul>
                        <li>
                            <a href="https://www.facebook.com/swaninbrayton" target="_blank"><i class="fab fa-facebook-f"></i></a>
                        </li>
                        <li>
                            <a href="#"><i class="fab fa-twitter"></i></a>
                        </li>
                        
                    </ul>
                </div>
            </div>
        </div>
    </div>

CSS

.mail-text {
  color: white !important;
}

.mail-text:hover {
  color: red !important;
}
j08691
  • 204,283
  • 31
  • 260
  • 272
skybluekid
  • 1

1 Answers1

0

Trying the code, it works correctly, when the mouse is somewhere else the text is white, instead when I go there with the mouse it turns red. Your problem I think is caching. Try deleting the website data in order to reload the css. You can read more about browser cache in this other question: Browser Caching of CSS files

Matteo
  • 118
  • 2
  • 12