Cf_cwd score 736
2015/02/10 11:16 投稿
| もし問題ないのであれば文章が入った要素を作成しwidthが可変になるようにしておき、以下のような状態を構築すると一応動作としては希望通りですがどうでしょうか？(Firefox 35.0.1にて) |
| 以下のようにしなくてもJavaScriptを使用しても比較的簡単に実装できるとは思います。 |
| もし問題ないのであれば文章が入った要素を作成しwidthが可変になるようにして、以下のような状態を構築すると一応動作としては希望通りですがどうでしょうか？(Firefox 35.0.1にて) |
| 以下のようにしなくてもJavaScriptを使用することで比較的簡単に実装できるとは思います。 |
| ```lang-html |
| <div style="width:40em" id="_wrap"> |
| <div style="width:auto;float:left" id="_text">AbcAbc</div> |
| <div style="width:20em;text-align:right"><input type="button" value="OK"></div> |
| </div> |
| ``` |
| #_wrapでは幅の指定を40文字に指定し、#_textは中に入っている文字数によって幅が変化するようにしているため以下のような流れで下段へ移動します。(#_textの中身が20文字になった時点で下段にボタンが移動) |
| ```lang-scr |
| x=id_textの文字数(この例では20文字と考えてください); |
| y=button要素を囲むdivのwidth(20em) |
| z=(id_wrapのwidth(40em) - (x + y)); |
| if(z<=0){ |
| button要素が下へ。 |
| }; |
| ``` |
| 追記:右寄せの部分を見落としていたので修正 |
| bottonにtext-align:rightを追加しました。 |
Cf_cwd score 736
2015/02/10 01:25 投稿
| もし問題ないのであれば文章が入った要素を作成しwidthが可変になるようにしておき、以下のような状態を構築すると一応動作としては希望通りですがどうでしょうか？(Firefox 35.0.1にて) |
| 以下のようにしなくてもJavaScriptを使用しても比較的簡単に実装できるとは思います。 |
| ```lang-html |
| <div style="width:40em" id="_wrap"> |
| <div style="width:auto;float:left" id="_text">AbcAbc</div> |
| <div style="width:20em"><input type="button" value="OK"></div> |
| <div style="width:20em;text-align:right"><input type="button" value="OK"></div> |
| </div> |
| ``` |
| #_wrapでは幅の指定を40文字に指定し、#_textは中に入っている文字数によって幅が変化するようにしているため以下のような流れで下段へ移動します。(#_textの中身が20文字になった時点で下段にボタンが移動) |
| ```lang-scr |
| x=id_textの文字数(この例では20文字と考えてください); |
| y=button要素を囲むdivのwidth(20em) |
| z=(id_wrapのwidth(40em) - (x + y)); |
| if(z<=0){ |
| button要素が下へ。 |
| }; |
| ``` |
| ``` |
| 追記:右寄せの部分を見落としていたので修正 |
| bottonにtext-align:rightを追加しました。 |
