空白の空白を返します。<br />ブートストラップと角度を使用する場合のタグ

Question

私が構築している特定のWebアプリケーションでは、私の<br />タグのすべてが基本的には何も出ていないことに気付きました。

私は原因を追跡するのにかなり努力しましたが、大したことはありません。 bootstrap,angular、font-awesomeを使用していますが、これは<br />のCSSマトリックスの表示です。

私が見る限り、私はここで何がそれを平らにする可能性があるのか​​分かりません。

*, *:before, *:after { 
    box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
} 
* { 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
} 

body { 
    font-family: 'Open Sans', serif; 
    font-weight: 300; 
    padding-bottom: 80px; 
} 
body { 
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
    font-size: 14px; 
    line-height: 1.42857143; 
    color: #333; 
    background-color: #fff; 
} 

html { 
    font-size: 10px; 
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
} 
html { 
    font-family: sans-serif; 
    -webkit-text-size-adjust: 100%; 
    -ms-text-size-adjust: 100%; 
} 

*, *:before, *:after { 
    box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
} 
*:before, *:after { 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
} 

*, *:before, *:after { 
    box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
} 
*:before, *:after { 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
} 

::-webkit-scrollbar { 
    width: 0.5em; 
    height: 0.5em; 
} 
::-webkit-scrollbar-thumb { 
    background: slategray; 
} 
::-webkit-scrollbar-track { 
    background: #b8c0c8; 
} 
body ::selection { 
    background-color: #0B6392; 
    text-shadow: none; 
    color: #fff; 
} 

そして、これは、その計算されたプロパティのリストである、Google Chrome

align-content: normal 
align-items: stretch 
align-self: stretch 
alignment-baseline: auto 
animation-delay: 0s 
animation-direction: normal 
animation-duration: 0s 
animation-fill-mode: none 
animation-iteration-count: 1 
animation-name: none 
animation-play-state: running 
animation-timing-function: ease 
backface-visibility: visible 
background-attachment: scroll 
background-blend-mode: normal 
background-clip: border-box 
background-color: rgba(0, 0, 0, 0) 
background-image: none 
background-origin: padding-box 
background-position: 0% 0% 
background-repeat: repeat 
background-size: auto 
baseline-shift: 0px 
border-bottom-color: rgb(51, 51, 51) 
border-bottom-left-radius: 0px 
border-bottom-right-radius: 0px 
border-bottom-style: none 
border-bottom-width: 0px 
border-collapse: separate 
border-image-outset: 0px 
border-image-repeat: stretch 
border-image-slice: 100% 
border-image-source: none 
border-image-width: 1 
border-left-color: rgb(51, 51, 51) 
border-left-style: none 
border-left-width: 0px 
border-right-color: rgb(51, 51, 51) 
border-right-style: none 
border-right-width: 0px 
border-top-color: rgb(51, 51, 51) 
border-top-left-radius: 0px 
border-top-right-radius: 0px 
border-top-style: none 
border-top-width: 0px 
bottom: auto 
box-shadow: none 
box-sizing: border-box 
break-after: auto 
break-before: auto 
break-inside: auto 
buffered-rendering: auto 
caption-side: top 
clear: none 
clip: auto 
clip-path: none 
clip-rule: nonzero 
color: rgb(51, 51, 51) 
color-interpolation: sRGB 
color-interpolation-filters: linearRGB 
color-rendering: auto 
column-count: auto 
column-gap: normal 
column-rule-color: rgb(51, 51, 51) 
column-rule-style: none 
column-rule-width: 0px 
column-span: none 
column-width: auto 
cursor: auto 
cx: 0px 
cy: 0px 
direction: ltr 
display: inline 
dominant-baseline: auto 
empty-cells: show 
fill: rgb(0, 0, 0) 
fill-opacity: 1 
fill-rule: nonzero 
filter: none 
flex-basis: auto 
flex-direction: row 
flex-grow: 0 
flex-shrink: 1 
flex-wrap: nowrap 
float: none 
flood-color: rgb(0, 0, 0) 
flood-opacity: 1 
font-family: 'Open Sans', serif 
font-kerning: auto 
font-size: 14px 
font-stretch: normal 
font-style: normal 
font-variant: normal 
font-variant-ligatures: normal 
font-weight: 300 
height: auto 
image-rendering: auto 
isolation: auto 
justify-content: normal 
left: auto 
letter-spacing: normal 
lighting-color: rgb(255, 255, 255) 
line-height: 20px 
list-style-image: none 
list-style-position: outside 
list-style-type: disc 
margin-bottom: 0px 
margin-left: 0px 
margin-right: 0px 
margin-top: 0px 
marker-end: none 
marker-mid: none 
marker-start: none 
mask: none 
mask-type: luminance 
max-height: none 
max-width: none 
min-height: 0px 
min-width: 0px 
mix-blend-mode: normal 
motion-offset: 0px 
motion-path: none 
motion-rotation: auto 0deg 
object-fit: fill 
object-position: 50% 50% 
opacity: 1 
order: 0 
orphans: auto 
outline-color: rgb(51, 51, 51) 
outline-offset: 0px 
outline-style: none 
outline-width: 0px 
overflow-wrap: normal 
overflow-x: visible 
overflow-y: visible 
padding-bottom: 0px 
padding-left: 0px 
padding-right: 0px 
padding-top: 0px 
paint-order: fill stroke markers 
perspective: none 
perspective-origin: 0px 0px 
pointer-events: auto 
position: static 
r: 0px 
resize: none 
right: auto 
rx: 0px 
ry: 0px 
shape-image-threshold: 0 
shape-margin: 0px 
shape-outside: none 
shape-rendering: auto 
speak: normal 
stop-color: rgb(0, 0, 0) 
stop-opacity: 1 
stroke: none 
stroke-dasharray: none 
stroke-dashoffset: 0px 
stroke-linecap: butt 
stroke-linejoin: miter 
stroke-miterlimit: 4 
stroke-opacity: 1 
stroke-width: 1px 
tab-size: 8 
table-layout: auto 
text-align: start 
text-align-last: auto 
text-anchor: start 
text-decoration: none 
text-indent: 0px 
text-overflow: clip 
text-rendering: auto 
text-shadow: none 
text-transform: none 
top: auto 
touch-action: auto 
transform: none 
transform-origin: 0px 0px 
transform-style: flat 
transition-delay: 0s 
transition-duration: 0s 
transition-property: all 
transition-timing-function: ease 
unicode-bidi: normal 
vector-effect: none 
vertical-align: baseline 
visibility: visible 
white-space: normal 
widows: 1 
width: auto 
will-change: auto 
word-break: normal 
word-spacing: 0px 
word-wrap: normal 
writing-mode: horizontal-tb 
x: 0px 
y: 0px 
z-index: auto 
zoom: 1 
-webkit-app-region: no-drag 
-webkit-appearance: none 
-webkit-background-composite: source-over 
-webkit-border-horizontal-spacing: 0px 
-webkit-border-vertical-spacing: 0px 
-webkit-box-align: stretch 
-webkit-box-decoration-break: slice 
-webkit-box-direction: normal 
-webkit-box-flex: 0 
-webkit-box-flex-group: 1 
-webkit-box-lines: single 
-webkit-box-ordinal-group: 1 
-webkit-box-orient: horizontal 
-webkit-box-pack: start 
-webkit-box-reflect: none 
-webkit-font-smoothing: auto 
-webkit-highlight: none 
-webkit-hyphenate-character: auto 
-webkit-line-break: auto 
-webkit-line-clamp: none 
-webkit-locale: "en" 
-webkit-margin-after-collapse: collapse 
-webkit-margin-before-collapse: collapse 
-webkit-mask-box-image: none 
-webkit-mask-box-image-outset: 0px 
-webkit-mask-box-image-repeat: stretch 
-webkit-mask-box-image-slice: 0 fill 
-webkit-mask-box-image-source: none 
-webkit-mask-box-image-width: auto 
-webkit-mask-clip: border-box 
-webkit-mask-composite: source-over 
-webkit-mask-image: none 
-webkit-mask-origin: border-box 
-webkit-mask-position: 0% 0% 
-webkit-mask-repeat: repeat 
-webkit-mask-size: auto 
-webkit-print-color-adjust: economy 
-webkit-rtl-ordering: logical 
-webkit-tap-highlight-color: rgba(0, 0, 0, 0) 
-webkit-text-combine: none 
-webkit-text-decorations-in-effect: none 
-webkit-text-emphasis-color: rgb(51, 51, 51) 
-webkit-text-emphasis-position: over 
-webkit-text-emphasis-style: none 
-webkit-text-fill-color: rgb(51, 51, 51) 
-webkit-text-security: none 
-webkit-text-stroke-color: rgb(51, 51, 51) 
-webkit-text-stroke-width: 0px 
-webkit-user-drag: auto 
-webkit-user-modify: read-only 
-webkit-user-select: text 
-webkit-border-image: none 
-webkit-text-orientation: vertical-right 

Answer 1

に応じてWebブラウザでの要素インスペクタでブレークタグを確認してください。それでも問題が解決しない場合は、<br style='height: 30px;' />を使用してみてください。それでも問題が解決しない場合は、CSSで次のコードを使用してください。

br { 
    padding-top: 10px !Important; 
}