In css how to joining two div classes without space?
在我的CSS中,我有以下内容:-
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 | body { background-color: #ffffff; font-family: arial, georgia, sans-serif; font-size: 16px; } .wrapper { width: 100%; position: relative; min-height: 1300px; background-color: yellow; -webkit-box-shadow: -10px 0 15px #000; -moz-box-shadow: -10px 0 15px #000; box-shadow: -10px 0 15px #000; -webkit-transition: -webkit-transform 0.2s ease; -moz-transition: -moz-transform 0.4s ease; -ms-transition: -ms-transform 0.4s ease; -o-transition: -o-transform 0.4s ease; transition: transform 0.4s ease; } .header1 { width: 100%; position: relative; min-height: 90px; clear:both; background: url(../images/tooplate_footer1.png) no-repeat; -webkit-transition: -webkit-transform 0.2s ease; -moz-transition: -moz-transform 0.4s ease; -ms-transition: -ms-transform 0.4s ease; -o-transition: -o-transform 0.4s ease; transition: transform 0.4s ease; } input[type="checkbox"]:checked ~ .wrapper { -webkit-transform: translateX(250px); -moz-transform: translateX(250px); -ms-transform: translateX(250px); -o-transform: translateX(250px); transform: translateX(250px); } input[type="checkbox"]:not(:checked) ~ .wrapper { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } input[type="checkbox"]:checked ~ .header1 { -webkit-transform: translateX(250px); -moz-transform: translateX(250px); -ms-transform: translateX(250px); -o-transform: translateX(250px); transform: translateX(250px); } input[type="checkbox"]:not(:checked) ~ .header1 { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } @media only screen and (min-width: 35em) { .wrapper { max-width: 1000px; margin: 0 auto; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .header1 { max-width: 1020px; margin: 0 auto; clear:both; } |
并且我的html正在跟踪;-
1 2 3 4 5 | <body> </body> |
现在我得到的页面就像
我要删除此空间。因此,两个div类可以连接在一起。我用margin-top:0px;但是空间并没有消失..请建议我。
两个div之间的空间来自环绕在后面的div,它使div高于外观。
要向上移动,请在页边空白处使用负值。
例如
1 2 3 4 5 6 7 8 9 10 11 12 13 | .header1 { width: 100%; position: relative; min-height: 90px; clear:both; background: url(../images/tooplate_footer1.png) no-repeat; -webkit-transition: -webkit-transform 0.2s ease; -moz-transition: -moz-transform 0.4s ease; -ms-transition: -ms-transform 0.4s ease; -o-transition: -o-transform 0.4s ease; transition: transform 0.4s ease; margin-top: -4px; //HERE } |