我怎樣才能讓按鈕向右移動，修復中間部分並使所有內容都可以調整大小

Question

我的 html 中有 3 個部分

文本區
標簽和以下 2 個按鈕
道路按鈕

我怎樣才能讓所有東西都可以調整大小並固定秒部分，這樣它就不會調整大小（標簽和下面的 2 個按鈕）並且有 3 個按鈕 Road 在右邊並且不會移動，它應該被修復。

所以簡而言之，textarea 應該是可調整大小的，並且秒部分和按鈕應該是固定的。

 <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title></title> <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> </head> <body> <div id="main_section" class="container"> <div class="cstm-item d-flex"> <div class=""> <textarea name=""></textarea> </div> <div class="h-100 text-center"> <span>LEFT RIGHT</span> <div> <button><i class="fa fa-minus"></i></button> <button><i class="fa fa-plus"></i></button> </div> </div> </div> <div> <button><i class="fa fa-road"></i></button> </div> </div> </body> </html>

Answer 1

這個解決方案會起作用。 如果 UI 對齊有什么問題，請告訴我。

<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    </head>
    <style>
        .solution {
            display: flex;
            align-items: center;
        }
        .solution > div {
            padding: 0 10px;
        }
        .solution > div:first-of-type {
            flex-grow: 1;
        }
        textarea {
            width: 100%;
        }
        
    </style>
    <body>
        <div id="main_section" class="container">
            <div class="solution">
                <div>
                    <textarea class="item-text-area" name=""></textarea> 
                </div>
                <div>
                    <span>LEFT RIGHT</span>                 
                    <div>
                        <button><i class="fa fa-minus"></i></button>
                        <button><i class="fa fa-plus"></i></button>
                    </div>
                </div>       
                <div>
                    <button><i class="fa fa-road"></i></button>
                </div>       
            </div>  
        </div>
    </body>
</html>

我怎樣才能讓按鈕向右移動，修復中間部分並使所有內容都可以調整大小

問題描述

1 個解決方案

解決方案1
2 已采納 2020-10-17 14:56:32

我怎樣才能讓按鈕向右移動，修復中間部分並使所有內容都可以調整大小

問題描述

1 個解決方案

解決方案1 2 已采納 2020-10-17 14:56:32

解決方案1
2 已采納 2020-10-17 14:56:32