CSS et responsive bootstrap

Bonjour,

Voilà j'ai presque fini mon site, cependant je viens de m'apercevoir que j'ai un probleme avec une div quand je test mon site sur mobile !
Mon site utilise boostrap ! je ne vois pas ou est le probleme et vous ?

ma div:

Code:

1
2
3
4
5
6
 
<div class="col-md-12">
     <h4 class="app-footer-text">
          <?= $words[1]['content'] ?>
     </h4>     
 </div>

CSS:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
h4.app-footer-text {
 
    background: #30499A;
 
    padding: 10px 20px;
 
    color: #fff;
 
    border-radius: 5px;
 
    position: relative; 
 
}
 
 
 
h4.app-footer-text:after {
 
    content: "";
 
    top: 5px;
 
    position: absolute;
 
    right: 0;
 
    border-left: 10px solid #fff;
 
    border-right: 10px solid transparent;
 
    border-top: 15px solid transparent;
 
    border-bottom: 15px solid transparent;
 
}