为什么内联块的内容区域是拉伸的

时间:2017-08-08 12:35:28

标签: css

为什么内联块的内容区域是拉伸



div {
  background: green;
  line-height: 40px;
}
span {
  background: white;
}
#inline-block {
  display: inline-block;
}

<div><span id="inline-block">AAA</span><span>AAA</span></div>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

我假设这是你想要的:https://jsfiddle.net/xcyvhphc/

HTML:

public class MyColleaguesAdapter extends RealmRecyclerViewAdapter<MyColleagueModel, MyColleaguesAdapter.ColleagueHolder>{

private List<MyColleagueModel> myColleagueModels;
private Context context;

public interface ColleagueListListener {

}

private final ColleagueListListener colleagueListListener;

public MyColleaguesAdapter(ColleagueListListener colleagueListListener, RealmResults<MyColleagueModel> realmResults, Context context ) {
    super(realmResults, true);
    this.context = context;
    this.colleagueListListener = colleagueListListener;
}

// create new views (invoked by the layout manager)
@Override
public ColleagueHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    //inflate a new colleague view
    View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.colleage_row_layout,parent,false);
    return new ColleagueHolder(view);
}
@Override
public void onBindViewHolder(ColleagueHolder holder, int position) {
    final MyColleagueModel myColleague = getData().get(position);
    //final MyColleagueModel myColleague=realmResults.get(position);
    holder.colleagueName.setText(myColleague.getName());
    holder.companyName.setText(myColleague.getCompany());
    holder.jobTitle.setText(myColleague.getTitle());
    holder.cardView.setTag(position);
    holder.cardView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            //editDataInterface.editData(view,position);
            int pos = (int)view.getTag();
            Intent i=new Intent(context,DetailMyColleague.class);
            i.putExtra("name",myColleague.getName());
            i.putExtra("title",myColleague.getTitle());
            i.putExtra("company",myColleague.getCompany());
            context.startActivity(i);
        }
    });

}

public class ColleagueHolder extends RecyclerView.ViewHolder{

   .......

      }
  }
 }

的CSS:

<div>
  <span>AAA</span>
  <span>AAA</span>
</div>

详细了解内联块和其他css显示属性here

答案 1 :(得分:0)

这是预期的行为。您将HTML设置为等于40px,因此这将成为您内容的高度,包括line-height。但是,第二个spansspan(默认值),因此inline不起作用,其高度保持不变。

如果您希望line-height高40像素,请使用div代替height: 40px;