firefox does not show the font correctly
Hi I’m working on a very simple asp form. I defined a class to style the <option> part of my page. This page is ok in google chrome, IE and Microsoft edge. However Firefox does not show the option font. My Firefox version is 95.0.2 and I searched a lot in google. However I didn’t find any answer. My font is “BMitra”. The screen shot and code of my page is as follows:
StyleSheet:
@font-face {
font-family: 'BMitra';
src: url('../fonts/BMitra.eot');
src: url('../fonts/BMitra.woff') format('woff');
src: url('../fonts/BMitra.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
body, html {
font-family: 'BMitra' !important; color: lightpink;
}
.option_font {
font-family: 'BMitra' !important; color: darkseagreen; font-size: 15px;
}
////////////////////////////////////////////////////////////////////////////////////// My code:
<label for="name1" style="font-size: 22px">لیست انتخاب نام</label>
<select id="name2" class="form-control" >
<option class="option_font">...</option>
<option class="option_font">تست 1</option>
<option class="option_font">تست2</option>
</select>
Hi
I’m working on a very simple asp form. I defined a class to style the <option> part of my page. This page is ok in google chrome, IE and Microsoft edge. However Firefox does not show the option font. My Firefox version is 95.0.2 and I searched a lot in google. However I didn’t find any answer. My font is “BMitra”. The screen shot and code of my page is as follows:
StyleSheet:
@font-face {
font-family: 'BMitra';
src: url('../fonts/BMitra.eot');
src: url('../fonts/BMitra.woff') format('woff');
src: url('../fonts/BMitra.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
body, html {
font-family: 'BMitra' !important;
color: lightpink;
}
.option_font {
font-family: 'BMitra' !important;
color: darkseagreen;
font-size: 15px;
}
//////////////////////////////////////////////////////////////////////////////////////
My code:
<div class="row" style="margin-top: 15px; margin-bottom: 15px;">
<div class="col-lg-3 col-sm-3 col-3"></div>
<div class="col-lg-6 col-sm-6 col-6">
<div class="form-group ">
<label for="name1" style="font-size: 22px">لیست انتخاب نام</label>
<select id="name2" class="form-control" >
<option class="option_font">...</option>
<option class="option_font">تست 1</option>
<option class="option_font">تست2</option>
</select>
</div>
</div>
</div>
<div class="col-lg-3 col-sm-3 col-3"> </div>
