Witam. Dołączyłem sobie do strony w css czcionkę OpenSans i co kilka sekund tekst tylko w jednym obszarze strony mi tak jakby miga - ustawiony mam "OpenSans" (regular), a to miganie to jakby "cieńszy", drobniejszy tekst się robił i za chwilę znowu normalny i tak w kółko. Kursorem nie muszę ruszać bo i tak się tak dzieje, w css nie mam zmiany czcionki nigdzie, dla całej strony mam jedną czcionkę ustawioną w elemencie body.
Problem jest tylko w jednej sekcji strony, w liście wyświetlanych przeze mnie filmów, na innych podstronach gdzie jest zwykły tekst, nie miga nic.
// css
@font-face {
font-family: 'OpenSans Light';
src: url('../fonts/OpenSans-Light.ttf') format('truetype');
}
@font-face {
font-family: 'OpenSans';
src: url('../fonts/OpenSans-Regular.ttf') format('truetype');
}
@font-face {
font-family: 'OpenSans Bold';
src: url('../fonts/OpenSans-Bold.ttf') format('truetype');
}
@font-face {
font-family: 'OpenSans Semibold';
src: url('../fonts/OpenSans-Semibold.ttf') format('truetype');
}
body {
margin: 0px;
padding: 0px;
font-family: 'OpenSans', Arial, Helvetica, sans-serif;
font-size: 14px;
background: #111;
color: #fff;
}
.movies-list .item .image {
width: 100%;
height: 235px;
overflow: hidden;
position: relative;
}
.movies-list .item .image img {
width: 100%;
height: 100%;
}
.movies-list .item .image .wrapper {
position: absolute;
bottom: 0px;
left: 0px;
font-size: 11px;
line-height: 17px;
color: #fff;
display: none;
padding: 8px 7px;
max-height: 100%;
width: 100%;
overflow: hidden;
background: rgba(0, 0, 0, 0.8);
}
.movies-list .item .image:hover .wrapper,
.movies-list .item .image .wrapper:hover {
display: block;
}
.movies-list .item .image a {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
color: #fff;
}
.movies-list .item .details {
margin-top: 5px;
}
.movies-list .item .title {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
// html
<div class="movies-list">
<?php if (!empty($movies)): ?>
<?php foreach ($movies as $value): ?>
<div class="item">
<div class="image">
<?php echo HTML::image($value['image']); ?>
<div class="wrapper">
<?php echo $value['description']; ?>
</div>
<?php echo HTML::anchor('#', ''); ?>
</div>
<div class="details">
<div class="title" title="<?php echo $value['title']; ?>"><?php echo $value['title']; ?></div>
</div>
</div>
<?php endforeach; ?>
<?php else: ?>
Brak filmów do wyświetlenia.
<?php endif; ?>
</div>