如何为我的ng-content所有子html元素设置CSS边距? [英] How to set css margin for my ng-content all child html elements?

问题描述

我需要在ng-content内所有HTML组件的上，下，左，右页边空白.如何为此编写CSS?我尝试了但没有工作.请帮助我解决此问题.

I need margin top,bottom,left,right of my all html components inside the ng-content.How to write the css for that? I tried but not working.Please help me to resolve this issue.

app.component.html:

app.component.html:

 <div class="wrapper"><ng-content></ng-content></div>  

app.component.css:

app.component.css:

  .wrapper{
  position:fixed;
  background-color:#ccc;
  height:60px;
  padding:10px;
  bottom:0;
  left:0;
  width:100%; 
  }
 .wrapper:: ng-deep <ng-content>{
  margin:5px 8px 4px 2px;
  padding:0;
  text-align:center;

  }

推荐答案

app.component.html

app.component.html

 <div class="wrapper">

 <button class="left">Left</button> 
 <button class="right">Right</button>

</div>  

app.component.css

app.component.css

.left{
  float:left;
}

.right{
  float:right;
}


.center{
   text-align: center; 
}


 .wrapper{
  margin:15px 8px 4px 2px;
  padding:0;
  text-align:center;
  width:100%; 
  height:60px;

}

您可以在<div class="wrapper"></div>中添加HTML内容.
我希望你觉得这有用！

You can add your HTML content inside <div class="wrapper"></div>.
I hope you found this useful!!

编辑
将类更改为包装器.

EDIT
Change class to wrapper.

这篇关于如何为我的ng-content所有子html元素设置CSS边距?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！