解決方法：父組件要一起使用屬性box-sizing:border-box;和overflow:hidden;注意子組件和父組件的寬度問題

.wxml代碼如下：

1. <view class="head">
2. <button type="text" class="headBtn" >加密</button>
3. <button class="headBtn" >解密</button>
4. </view>
5. <view class="passAndEncrypt">
6. <input class="encryptedPass" />
7. <button class="encryptedTextBtn" >粘貼密文</button>
8. </view>
9. <textarea />

.wxss代碼如下：

1. .head,.passAndEncrypt,textarea{
2. box-sizing: border-box;
3. display: block;
4. padding:0px;
5. margin-left:auto;
6. margin-right:auto;
7. width:89.375%;
8. min-width: 310px;
9. }
10. .head{
11. padding-top:20px;
12. }
13. .passAndEncrypt{
14. height:42px;
15. }
16. .headBtn{
17. display: inline-block;
18. width:50%;
19. text-align:center;
20. margin:0px;
21. padding:0px;
22. background-color:white;
23. border-radius: 0px;
24. border-color: white;
25. color: gray;
26. font-size:14px;
27. }
28.  
29.  
30. .encryptedPass{
31. float: left;
32. border:1px solid rgb(220,220,220);
33. border-radius: 3px;
34. padding-left: 4px;
35. margin:0px;
36. height: 40px;
37. background-color:white;
38. width:50%;
39. /* text-overflow:clip; */
40. overflow:hidden;
41. white-space:nowrap;
42. }
43.  
44. .encryptedTextBtn{
45. font-size: 14px;
46. float: right;
47. margin:0px;
48. width:50%;
49. background-color:#CC3333;
50. color:white;
51. height: 40px;
52. /* border-radius:0px; */
53. overflow:hidden;
54. }
55.  
56. .textarea{
57. border:1px solid rgb(220,220,220);
58. padding:6px;
59. line-height:20px;
60. margin-top:20px;
61. height:150px;
62. border-radius:3px;
63. background-color:white;
64. }

從上面可以看出來：解密密碼和點擊解密整體下移了

原因：是因為解密密碼和點擊解密兩個加起來的寬度超過了父元素的寬度，如上面紅色字體所示，所以修改子組件的寬度并為父組件添加屬性overflow,如下面所示：

1. .head,.passAndEncrypt,textarea{
2. box-sizing: border-box;
3. display: block;
4. padding:0px;
5. margin-left:auto;
6. margin-right:auto;
7. width:89.375%;
8. min-width: 310px;
9. overflow:hidden;
10. }
11.  
12. encryptedPass{
13. float: left;
14. border:1px solid rgb(220,220,220);
15. border-radius: 3px;
16. padding-left: 4px;
17. margin:0px;
18. height: 40px;
19. background-color:white;
20. width:47%;
21. /* text-overflow:clip; */
22. overflow:hidden;
23. white-space:nowrap;
24. }
25.  
26. .encryptedTextBtn{
27. font-size: 14px;
28. float: right;
29. margin:0px;
30. width:47%;
31. background-color:#CC3333;
32. color:white;
33. height: 40px;
34. /* border-radius:0px; */
35. overflow:hidden;
36. }

顯示效果：