html - Fixed position footer isn't scrollable horizontally off-screen -


i need footer stay fixed bottom of page @ times, , need give minimum-width left content , right content don't collide each other (as per designer's mock up). problem arises if user's viewport skinny, right side of content gets cut off screen, , there's no way access it. i'd not have change way menu behaves (adding media query breakpoints or something) , rather have menu acts more position:absolute @ bottom la position:fixed.

any ideas?

.footer {      width: 100%;      min-width: 500px;      position: fixed;      bottom: 0;      left: 0;      background: #eee;      height: 50px;  }    .left {      float: left;  }    .right {      float: right;  }  }
<div class="footer">      <div class="left">my left content</div>      <div class="right">my right content</div>  </div>

try setting min-width property each side as

.left {     float: left;     min-width:250px; }  .right {     float: right;     min-width:250px; } 

you can set them smaller px size make right side stay open @ smaller width. if want fancy create media query remove float @ width


Comments

Popular posts from this blog

python - pip install -U PySide error -

arrays - C++ error: a brace-enclosed initializer is not allowed here before ‘{’ token -

cytoscape.js - How to add nodes to Dagre layout with Cytoscape -