Semantic-ui: [Form] Fluid Inline Field Variation

[guilhermeblanco]

While testing on Firefox 26 on a Mac 10.9, I found that inline does not work with both fluid and labeled.

Example code:

<form action="" method="post" name="authentication">
  <div class="field inline">
    <label class="required" for="authentication_username">Username</label>
    <div class="ui input labeled left icon fluid">
      <input id="authentication_username" type="text" placeholder="Username" maxlength="75" required="required" name="authentication[username]">
      <i class="icon user"></i>
      <div class="ui corner label">
        <i class="asterisk icon"></i>
      </div>
    </div>
  </div>
</form>

Optimized JSFiddle... http://jsfiddle.net/w7RsD/7/

[jlukic]

Hi, it does make sense this is working, but I'm not sure it can be fixed from a ui input level because it cannot know the width of the label next to it.

Perhaps I can add a variation for ui form field which allows for fluid inline field, dividing up the label and input automatically.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 30 days if no further activity occurs. Thank you for your contributions.

[manikandanpachaiyappan]

this will be the solution for the question
https://jsfiddle.net/4x8d56sw/?utm_source=website&utm_medium=embed&utm_campaign=4x8d56sw