可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效,请关闭广告屏蔽插件后再试):
问题:
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 }