KPC
Kevin Powell - Community•5mo ago
Natejoestev

css column expand to fit area

i have: 
<div class="a">
  <button>Btn</button>
  <span>Text</span>
  <button>Btn</button>
</div>
<div class="a">
  <button>Btn</button>
  <span>Text</span>
  <button>Btn</button>
</div>
button {
  width: 4em;
}
button {
  width: 4em;
}
how can i make the span expand to fit the area given. *div is inside another element with a width.
6 Replies
Natejoestev
Natejoestev•5mo ago
also, i might want to add more buttons around the span
clevermissfox
clevermissfox•5mo ago
If you’re using flex, you could give the span a flex grow:1
b1mind
b1mind•5mo ago
Or control it all with a grid-template 😄 grid-template-columns: auto 1fr auto;
b1mind
b1mind•5mo ago
b1mind
b1mind•5mo ago
Grid can often times give you much more flexibility than flex 🥁 But also its going to want to fill space not shrink children by default
Natejoestev
Natejoestev•5mo ago
exactly like #4 but btn span btn btn and the span expands
Want results from more Discord servers?
Add your server
More Posts
Need help with responsie header icon 2I shouldn't have deleted first post, sorry I am learning I am struggling to make the icon responsivcustom cursor effectSomeone posted this awhile ago asking about the custom cursor (I think it’s only visible on desktop)need to couple class to my js fileps im tired it is 1 at night here trying to fix itwhite color!white backgroundHey guys!I have a problem:) my text color is always white,but the background can change!the problem how do I make an infinite horizontal scrollHow do I make an infinite horizontal image scrollOverflowHi everyone, Im trying to make a portfolio with some projects. I wanna make a "one pager", so whBootstrapHello, There is an issue with the div number 3, where it skips a line (at width = 1263 pixels and bcharacters count using jsI am unable to count the characters in an input tag . I want something like when the user will enterGrid template rows - Height AutoHi there, How would I make these grid items all the same height using auto? How do I declare thisreact native errorhi I’m currently facing this error. I’m running the app but this error is popping up. I’m using the