CODEWITHSUNDEEP
htmlcssmacoswindows-10
TomoDevelops
TomoDevelops

Reputation: 51

The copyright symbol (©) is appearing smaller on Mac browser

The copyright symbol (©) is appearing smaller on my Mac browser. I have tried © and the ::before pseudo element but they are rendered smaller than the text surrounding it on Macs. Do I have to insert an image to make this work?

<p class="copyright-text">
  &copy;Copyright <span class="current-year"></span> (company name). All Rights Reserved
</p>

Upvotes: 0

Views: 1647

Answers (2)

Muhammed Rahif
Muhammed Rahif

Reputation: 668

Change font-size:__; of symbol to adjust size...

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Copyright Symbol Size</title>

    <style>
        #copyright-symbol{
            font-size: 3em;
        }
    </style>
</head>

<body>
    <p class="copyright-text">
        <span id="copyright-symbol">&copy;</span>Copyright <span class="current-year"></span> (company name). All Rights Reserved
    </p>
</body>

</html>

Upvotes: 1

kmiklas
kmiklas

Reputation: 13453

(NOTE: SO was giving me fits, interpreting html examples, so I had to quote them)

  1. You don't tell us what font you're using; perhaps it is not installed on your Mac, and it's defaulting to a different font? Inspect and verify that it's displaying the font that you think it is.

  2. Try changing the font of the copyright symbol to a fixed-width or type safe font; like Georgia, Consolas, or Verdana, like so:

// Style
copyright { font-family: Georgia, Consolas, Verdana }

<span class="copyright">&copy;</span>

© Copyright 2021, Amalgamated Bipartisan Conglomerates

<p class="copyright-text">
    <span style="font-family: Georgia, Consolas, Verdana">&copy;</span>Copyright <span class="current-year"></span> (company name). All Rights Reserved
</p>
  1. If you set your character set to UTF-8, you can also try just using the symbol itself (not the &copy;) like so:
meta charset="UTF-8">
span class="copyright">©</span>

<p class="copyright-text">
    <span style="font-family: Georgia, Consolas, Verdana">©</span>Copyright <span class="current-year"></span> (company name). All Rights Reserved
</p>

© Copyright 2021, Amalgamated Bipartisan Conglomerates

Upvotes: 1

Related Questions