Вместо рубля во всех браузерах квадраты

Могу предположить, что в шрифте, который используется, просто нет этого знака. Нужно, чтобы шрифт подгружался и полагаю делается это через @font-face.

Эта проблема может возникнуть, если шрифт, используемый на сайте, не содержит символ рубля. В этом случае символ рубля может отображаться как квадрат или прямоугольник. Одно из возможных решений - это использование другого шрифта, который содержит символ рубля. Также можно попробовать установить модуль или плагин, который изменяет шрифт рубля и тем самым отображения на всех версиях браузеров.

в кодировке браузера

Дело может быть в кодировке файла, которая не соответствует заявленной в шапке HTML-странички. В этом случае возникают проблемы с декодированием символов, отличных от ASCII, в том числе знака рубля.

Попробуйте вместо знака рубля указать его HTML-сущность:

 ₽