项目最大高度取决于最大内容项目

时间:2018-05-15 09:10:31

标签: html css

我有一组带有新闻的项目,我希望每个项目的高度与最大内容项目的高度相同。我想将固定高度改为动态。

<ComboBox ItemSource="{Binding Items}">
    <ComboBox.Resources>
        <Style TargetType="ComboBoxItem">
            <Setter Property="Backgournd">
                <Setter.Value>
                    <SolidColorBrush Color="{Binding RelativeSource=
                    {RelativeSource AncestorType=ComboBoxItem},
                    Path=Content.Color}"/>
                </Setter.Value>
            </Setter>
            <Setter Property="Margin" Value="-1 -1"/>
        </Style>
    </ComboBox.Resources>
</ComboBox>

2 个答案:

答案 0 :(得分:1)

您也可以使用display flex

.row {
  display: flex;
  flex-wrap: wrap;
}

.article-3 {
  border: 1px solid coral;
  padding: 1rem;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>


<div class="row"> 
  <div class="col-md-6 col-xs-12 article-3"> 
    <a href="#" style="text-decoration:none" > 
      <span>some text</span> 
      <h4>some text</h4> 
    </a> 
  </div> 
  
  <div class="col-md-6 col-xs-12 article-3"> 
    <a href="#" style="text-decoration:none" > 
      <span>
        some more text some more text
        some more text some more text
        some more text some more text
        some more text some more text
        some more text some more text
      </span> 
      <h4>some more text</h4> 
    </a> 
  </div> 
</div>

答案 1 :(得分:0)

你可以通过以下grid技术实现它:

&#13;
&#13;
.container {
	display: grid;
	grid-template-columns: 1fr;
	grid-auto-rows: 1fr;
}
&#13;
<section class="container">
  <div style="background-color:#F00">
    fasdfads fad
  </div>
  <div style="background-color:#960">
    fadsfadsfads<p>fadfdasfds</p>
  </div>
  <div style="background-color:#0C3">
    afadsfads
  </div>
</section>
&#13;
&#13;
&#13;