Difference between revisions of "Template:Paris Bettencourt/cssFooter"
(41 intermediate revisions by 2 users not shown) | |||
Line 7: | Line 7: | ||
#footer { | #footer { | ||
+ | position: relative; | ||
+ | bottom: 0; | ||
width: 100%; | width: 100%; | ||
background-color: black; | background-color: black; | ||
− | |||
margin: auto; | margin: auto; | ||
− | padding: | + | padding: 0; |
+ | height: 250px; | ||
} | } | ||
+ | #footer img { | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | margin: auto; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | max-width: 80%; | ||
+ | max-height: 180px; | ||
+ | top: 0; | ||
+ | } | ||
+ | |||
+ | |||
+ | #footer .col { | ||
+ | position: relative; | ||
+ | width: 20%; | ||
+ | height: 250px; | ||
+ | vertical-align: middle; | ||
+ | text-align: center; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | /* | ||
#a { | #a { | ||
width: 20%; | width: 20%; | ||
Line 25: | Line 48: | ||
margin: auto; | margin: auto; | ||
padding: 10px; | padding: 10px; | ||
− | padding-top: | + | padding-top: 30px; |
− | font-family: 'Arial', sans-serif; | + | font-family: 'Arial', sans-serif; |
color: white; | color: white; | ||
line-height: 23px; | line-height: 23px; | ||
font-size: 16px; | font-size: 16px; | ||
− | margin-top: | + | margin-top: 25px; |
text-align: left; | text-align: left; | ||
} | } | ||
Line 37: | Line 60: | ||
float: left; | float: left; | ||
margin: auto; | margin: auto; | ||
− | margin-top: | + | margin-top: 55px; |
} | } | ||
Line 99: | Line 122: | ||
margin: 0; | margin: 0; | ||
margin-top: 25px; | margin-top: 25px; | ||
+ | } | ||
+ | #d img { | ||
+ | width: 70px; | ||
} | } | ||
} | } | ||
@media only screen and (max-width : 750px) { | @media only screen and (max-width : 750px) { | ||
#footer { | #footer { | ||
− | height: | + | height: 630px; |
+ | display: flex; | ||
+ | flex-direction: column; | ||
} | } | ||
#a { | #a { | ||
− | width: 50%; | + | width: 50%; |
− | + | margin-top: 20px; | |
+ | order: 1; | ||
} | } | ||
#a img { | #a img { | ||
− | height: | + | height: 170px; |
− | width: | + | width: 170px; |
} | } | ||
#b { | #b { | ||
− | width: | + | width: 400px;; |
− | + | margin: auto; | |
+ | order: 3; | ||
} | } | ||
#c { | #c { | ||
− | width: 45% | + | width: 45%; |
float: top; | float: top; | ||
− | + | margin-top: 20px; | |
+ | order: 2; | ||
} | } | ||
#c img { | #c img { | ||
− | width: | + | width: 250px; |
} | } | ||
#d { | #d { | ||
width: 45%; | width: 45%; | ||
− | margin-top: | + | margin-top: 0px; |
float: left; | float: left; | ||
+ | order: 4; | ||
+ | } | ||
+ | #d img { | ||
+ | width: 70px; | ||
} | } | ||
} | } | ||
− | + | */ | |
</style> | </style> | ||
</html> | </html> |
Latest revision as of 16:10, 13 November 2015