title: CSS distinguishing styling within input[type=text]
body: <p>I have a few <code>input[type=text]</code> fields, which I would like to customize in a different way.</p>
  <p>I have got to know, that we can apply our styling even for the <code>name</code> property.</p>
  <p><a href="https://stackoverflow.com/questions/5468766/can-i-apply-a-css-style-to-an-element-name">Can I apply a CSS style to an element name?</a></p>
  <p>Unfortunately, it doesn't work in my case.</p>
  <p>My code looks like this:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>fig input[type=text]
          {
              width: 250px;
              min-width: 100px;
              padding: 12px 20px;
              box-sizing: border-box;
              outline: none;
              border: 1px solid #f7fbff;
              background-color: #f7fbff;
              display: inline-block; 
          }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>             &lt;figure class="fig"&gt;
              &lt;input type="text" name="riser_cupboard_key_type" 
                                                      pattern="[A-Za-z].{4,}" 
                                                      title="The text should include at least 4 
              letters" placeholder="Enter your answer" required&gt;
           &lt;/figure&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>All thhe options beloe weren't working</p>
  <pre><code> .fig input[type=text] &gt; input[name=&quot;riser_cupboard_key_type&quot;] {
      width: 600px;
   }
  
   .fig input[type=text]  input[name=&quot;riser_cupboard_key_type&quot;] {
      width: 600px;
   }
  
   .fig input[name=&quot;riser_cupboard_key_type&quot;] {
      width: 600px;
   }
  </code></pre>
  <p>How can I make only this specified input different than others?</p>