html - CSS: Avoid disappearence of a component when screen is too narrow -


i'm complete newbie @ css. i'm using twenty template , when make screen quite narrow, grey box in center disappears. know it's meant way because it's responsive, how can alter behavior?

i'd adjust width @ disappearance happens. suspect it's somewhere in part of css code:

#banner .inner {   -moz-animation: reveal-banner 1s 0.25s ease-in-out;   -webkit-animation: reveal-banner 1s 0.25s ease-in-out;   -o-animation: reveal-banner 1s 0.25s ease-in-out;   -ms-animation: reveal-banner 1s 0.25s ease-in-out;   animation: reveal-banner 1s 0.25s ease-in-out;   -moz-animation-fill-mode: forwards;   -webkit-animation-fill-mode: forwards;   -o-animation-fill-mode: forwards;   -ms-animation-fill-mode: forwards;   animation-fill-mode: forwards;   background: rgba(20, 20, 20, 0.90); /*color y opacidad de la caja oscura en home */   color: white;   display: inline-block;   opacity: 0;   padding: 3em;   text-align: center; } 

it doesn't disappear. adds (within "mobile" media query @media screen , (max-width: 736px)):

#banner .inner {   background: none;   display: block;   padding: 0 1.5em; } 

so code above is:

  • remove background
  • "expands" .inner viewport display:block
  • applies .inner padding left , right, text not "touch" edges of viewport.

Comments

Popular posts from this blog

qt - Using float or double for own QML classes -

Create Outlook appointment via C# .Net -

ios - Swift Array Resetting Itself -