CSS：我如何缩进一个文本区域而不是另一个文本区域？

Question

我试图缩进这整个形式：

<%= form_for([micropost, micropost.comments.build], :html => { :id => "blah_form" }) do |f| %> 

     <div class="field"> 
      <p2>Who are you?</p2> 
      <%= f.text_field :commenter %> 
     </div> 
     <div class="field"> 
      <p2>What deal are you offering?</p2> 
      <%= f.text_area :body %> 
     </div> 
     <div class="actions"> 
      <%= f.submit "Submit"%> 
     </div> 
     <% end %> 

，但我不想以这种形式缩进这个其他文本区域：

<%= form_for(@micropost) do |f| %> 
     <%= render 'shared/error_messages', object: f.object %> 
     <div class="field"> 
     <%= f.text_area :content, placeholder: "What's something else you want to buy?" %> 
     </div> 
     <%= f.submit "Post", class: "btn btn-large btn-primary" %> 
    <% end %> 

现在我的CSS文件说：

#blah_form input, textarea, b4 {margin-left:80px} 

Answer 1

#blah_form input, textarea, b4 {margin-left:80px} 

是三个单独的声明，试试这个，而不是你的CSS本地化到该窗体

#blah_form input, 
#blah_form textarea, 
#blah_form b4 
    {margin-left:80px} 

或可能创建一个缩进类：

.indent { 
    margin-left:80px; 
} 

，可以在需要缩进​​的所有元素中。你可以让这个类更智能一些，以便将缩进应用到特定的嵌套元素，例如

.indent > div { 
    margin-left:80px; 
} 

（不会工作在IE6）这话说的margin-left适用于那些div的.indent的所有直接子女。

Answer 2

添加另一个阶级围绕textarea的股利并用它来去除利润率左

EG。

<div class="field no-indent"> 

而在你的CSS：

.no-indent textarea { margin-left:0 } 

而且你的CSS

#blah_form input, textarea, b4 {margin-left:80px} 

正在申请中#blah_form和所有的textarea的和B4的（我想你的意思是任何输入类b4，在这种情况下它应该是.b4）