tag:blogger.com,1999:blog-9036282163200561953.post7081474502859258098..comments2023-07-07T00:12:27.367+09:00Comments on kawama.jp: CSS文法チェッカーoyabakatousanhttp://www.blogger.com/profile/03804158029447388256noreply@blogger.comBlogger1125tag:blogger.com,1999:blog-9036282163200561953.post-42866736843742562742018-06-12T20:25:27.000+09:002018-06-12T20:25:27.000+09:00*{padding: 0;margin: 0 auto;}#space{margin-right: ...*{<br>padding: 0;<br>margin: 0 auto;<br>}<br><br><br>#space{<br>margin-right: 20px;<br>margin-left: 20px;<br>}<br><br>#page{<br>width: 1000px;<br>}<br><br>#header{<br>margin-bottom: 40px;<br>}<br><br>#header h1{<br>text-align: center;<br>margin: 30px 0;<br>}<br><br>#header ul{<br>overflow: hidden;<br>width: 1000px;<br>}<br><br>#header ul li:nth-child(-n+3){<br>float: left;<br>list-style: none;<br>color: #ffffff;<br>width: 249px;<br>text-align: center;<br>padding: 10px 0;<br>background-color: #1d4000;<br>border-top: solid 1px black;<br>border-bottom: solid 1px black;<br>border-left: solid 1px black;<br>}<br><br>#header ul li:nth-child(4){<br>float: left;<br>list-style: none;<br>color: white;<br>width: 248px;<br>text-align: center;<br>padding: 10px 0;<br>background-color: #1D4000;<br>border: solid 1px black;<br>}<br><br>#contents{<br>overflow: hidden;<br>}<br><br>#main{<br>width: 620px;<br>float: left;<br>}<br><br>#main h2{<br>font-weight: lighter;<br>border-left: solid 2px #000000;<br>padding-left: 20px;<br>margin-bottom: 10px;<br>}<br><br>#main img{<br>margin-bottom: 15px;<br>}<br><br>#main p{<br>margin-bottom: 20px;<br>}<br><br>#side{<br>float: right;<br>width: 300px;<br>}<br><br>#side h3{<br>font-weight: lighter;<br>margin-bottom: 5px;<br>}<br><br>#side img{<br>margin-bottom: 10px;<br>}<br><br>#side p{<br>margin-bottom: 20px;<br>}<br><br>#footer{<br>clear: both;<br>color: #ffffff;<br>font-size: 0.8em;<br>text-align: center;<br>background-color: #000000;<br>padding: 20px 0;<br>}<br><br><br><br><br>@media screen and (max-width: 420px){<br><br>*{<br>padding: 0;<br>margin: 0 auto;<br>}<br><br>all{ /*追加*/<br>max-width: 100%;<br>}<br><br>#space{<br>margin-right: 10px; /*変更*/<br>margin-left: 10px; /*変更*/<br>}<br><br>#page{<br>width: 400px; /*変更*/<br>}<br><br>#header{<br>margin-bottom: 40px;<br>}<br><br>img{<br>max-width: 100%; /*変更*/<br>}<br><br>#header h1{<br>text-align: center;<br>margin: 30px 0;<br>}<br><br>#header ul{<br>overflow: hidden;<br>width: 400px; /*変更*/<br>}<br><br>#header ul li:nth-child(1){ /*追加*/<br>float: left;<br>list-style: none;<br>color: #ffffff;<br>width: 198px;<br>text-align: center;<br>padding: 10px 0;<br>background-color: #1d4000;<br>border-top: solid 1px black;<br>border-right: solid 1px black;<br>border-bottom: solid 1px black;<br>border-left: solid 1px black;<br>}<br><br>#header ul li:nth-child(2){ /*追加*/<br>float: left;<br>list-style: none;<br>color: white;<br>width: 199px;<br>text-align: center;<br>padding: 10px 0;<br>background-color: #1d4000;<br>border-top: solid 1px black;<br>border-right: solid 1px black;<br>border-bottom: solid 1px black;<br>border-left: solid 0 black;<br>}<br><br>#header ul li:nth-child(3){ /*追加*/<br>float: left;<br>list-style: none;<br>color: white;<br>width: 198px;<br>text-align: center;<br>padding: 10px 0;<br>background-color: #1d4000;<br>border-top: solid 0 black;<br>border-right: solid 1px black;<br>border-bottom: solid 1px black;<br>border-left: solid 1px black;<br>}<br><br>#header ul li:nth-child(4){ /*追加*/<br>float: left;<br>list-style: none;<br>color: white;<br>width: 199px;<br>text-align: center;<br>padding: 10px 0;<br>background-color: #1d4000;<br>border-top: solid 0 black;<br>border-right: solid 1px black;<br>border-bottom: solid 1px black;<br>border-left: solid 0 black;<br>}<br><br>#contents{<br>overflow: hidden;<br>}<br><br>#main{<br>width: 400px; /*変更*/<br>float: none; /*変更*/<br>}<br><br>#main h2{<br>font-weight: lighter;<br>border-left: solid 2px #000000;<br>padding-left: 20px;<br>margin-bottom: 10px;<br>}<br><br>#main img{<br>width: 100%; /*追加*/<br>margin-bottom: 15px;<br>}<br><br>#main p{<br>margin-bottom: 20px;<br>}<br><br>#side{<br>float: left; /*変更*/<br>width: 300px;<br>}<br><br>#side h3{<br>font-weight: lighter;<br>margin-bottom: 5px;<br>}<br><br>#side img{<br>margin-bottom: 10px;<br>}<br><br>#side p{<br>width: 400px; /*追加*/<br>margin-bottom: 20px;<br>}<br><br>#footer{<br>clear: both;<br>color: #ffffff;<br>font-size: 0.8em;<br>text-align: center;<br>background-color: #000000;<br>padding: 20px 0;<br>}<br><br>}ああnoreply@blogger.com