CODEWITHSUNDEEP
javascripthtmlcsstwitter-bootstrap
Pavel Voronin
Pavel Voronin

Reputation: 13995

Fixed element without predefined width initially put in bootstrap container does not inherit width from parent

I am playing with sticky functionality, making element stay at the top when scrolling. It is a div inside bootstrap fluid container.
Alas, as soon as it becomes fixed it gets its width defined by children (label and text input).

width: inherit has no effect.

What magic do I need for making width the same it would be if element was static.

Upvotes: 0

Views: 53

Answers (2)

thepio
thepio

Reputation: 6263

Based on your comment you could do it like this:

body {
  margin: 10px;
  height: 1000px;
}

.fixed {
  position: fixed;
  height: 30px;
  background-color: red;
  right: 10px;
  left: 10px;
}
<body>
  <div class="fixed"></div>
</body>

So basically you just set the left and right values to the same value as your body margin on the left and right sides.

Upvotes: 1

t1m0n
t1m0n

Reputation: 3431

Fixed elements are positioned relative to the body, so setting inherit will not do anything, unless there is width on body. Only way to make it relative to another element is to using js.

Upvotes: 2

Related Questions