div get shrinked when using postion: fixed

匿名 (未验证) 提交于 2019-12-03 02:38:01

问题:

I'm having a <div> and I want to make it's position: fixed. I've added CSS rule position:fixed but after adding that the <div> gets shrink.

Please guide me into this.

my html code is this

<div layout="row" style="background-color:#1CA5EA; position:fixed">      <div offset="25" flex="30" class="input-container">        <md-input-container flex >           <label style="color:white">Search</label>           <input ng-model="search" style="border-bottom:2px solid white;color:white;">        </md-input-container>     </div>      <div flex="10" class="input-container">        <button class="primary-button md-button md-default-theme">          <span class="ng-scope" ui-sref="company.addRecruitmentProject">            + JOB AD          </span>        </button>     </div>   </div> 

回答1:

Use width:100%; for that div.

<div layout="row" style="background-color:#1CA5EA; position:fixed; width:100%;">      <div offset="25" flex="30" class="input-container">        <md-input-container flex >           <label style="color:white">Search</label>           <input ng-model="search" style="border-bottom:2px solid white;color:white;">        </md-input-container>     </div>      <div flex="10" class="input-container">        <button class="primary-button md-button md-default-theme">          <span class="ng-scope" ui-sref="company.addRecruitmentProject">            + JOB AD          </span>        </button>     </div>   </div> 

Demo here



回答2:

May be other div or element of Html make effect on the Div. thats why your div gets shrinked. and secondly please add your css code here then after i can resolve your problem hopefully.



回答3:

In that case, you should define the width of your <div> whose position is fixed. Let's say for example:

.div {    width: 80%; // or whatever you want to be the size } 


标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!