Can someone please tell me why my icons are weird?

https://saxobroko.gq or https://saxbroko.000webhostapp.com
I know it has something to do with css but nothing i do fixes it.

Which icons, can you please specify?

the sidebar on the left and the social icons in the second section as you scroll down.

1 Like

And what’s weird in them?

the icons are to big.

Then use CSS to make them smaller or use smaller images :slight_smile:

ive tried it doesnt work

Hit CTRL F5 to force refresh.
Are you using CloudFlare?

i’ve been using ctrl shift r and yes im using cloudflare

this is currently my sidebar code.

echo “<nav class=“w3-sidebar nobar side w3-bar-block w3-small w3-hide-small w3-center”>\n”;
echo “<a class=“w3-bar-item w3-padding-large” href=”#" ><img src=“https://db.saxobroko.gq/picture/avataaars.svg” draggable=“false” style=“width:100%;” alt=“Saxo_Broko cartoon style face”>\n";
echo “<a “class=“w3-bar-item w3-button w3-padding-large w3-hover-black” href=”/”><svg style=“width:70px; class=“icon icon-home”><use xlink:href=“symbols.svg#icon-home”>

HOME

\n”;
echo “<a class=“w3-bar-item w3-button w3-padding-large w3-hover-black” href=”#status"><svg style=“width:70px; class=“icon icon-check”><use xlink:href=“symbols.svg#icon-check”>

STATUS

\n”;
echo “<a class=“w3-bar-item w3-button w3-padding-large w3-hover-black” href=”/games.php"><img draggable=“false” style=“filter: invert(1);” width=“90%” src=“images/gamepad.svg”>

GAMES

\n";
echo "<a class=“w3-bar-item w3-button w3-padding-large w3-hover-black” href=“https://saxob.ga/SaxoYT”><svg style=“width:70px; class=“icon icon-youtube”><use xlink:href=“symbols.svg#icon-youtube”>

YOUTUBE

\n”;
echo "<a class=“w3-bar-item w3-button w3-padding-large w3-hover-black” href=“https://saxob.ga/SaxoBlog”><svg style=“width:70px; class=“icon icon-pencil”><use xlink:href=“symbols.svg#icon-pencil”>

BLOG

\n”;
echo “”;

Possibly turn on developer mode on CloudFlare?