You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
947 B
CSS
63 lines
947 B
CSS
2 years ago
|
section.examples .example-box {
|
||
|
background-color: #3268aa;
|
||
|
border: 3px solid #88ff9c;
|
||
|
height: 3rem;
|
||
|
width: 3rem;
|
||
|
border-radius: .3rem;
|
||
|
margin: .5rem;
|
||
|
display: flex;
|
||
|
justify-content: center;
|
||
|
align-items: center;
|
||
|
flex: 0 0 auto;
|
||
|
}
|
||
|
|
||
|
section.examples .example-box.active {
|
||
|
border: 3px solid #d73f3f;
|
||
|
}
|
||
|
|
||
|
.visual-example {
|
||
|
display: flex;
|
||
|
flex-direction: row;
|
||
|
position: relative;
|
||
|
padding: .5rem;
|
||
|
}
|
||
|
|
||
|
#example1 .active {
|
||
|
position: static;
|
||
|
top: 1rem;
|
||
|
left: 1rem;
|
||
|
}
|
||
|
|
||
|
#example2 .active {
|
||
|
position: relative;
|
||
|
top: 1rem;
|
||
|
left: 1rem;
|
||
|
}
|
||
|
|
||
|
#example3 .active {
|
||
|
position: absolute;
|
||
|
top: 1rem;
|
||
|
left: 1rem;
|
||
|
}
|
||
|
|
||
|
#example4 .active {
|
||
|
position: fixed;
|
||
|
top: 1rem;
|
||
|
left: 1rem;
|
||
|
}
|
||
|
|
||
|
#example5 {
|
||
|
overflow: scroll;
|
||
|
}
|
||
|
|
||
|
#example5 .active {
|
||
|
position: sticky;
|
||
|
left: 1rem;
|
||
|
right: 1rem;
|
||
|
}
|
||
|
|
||
|
#example5 .wrapper {
|
||
|
display: flex;
|
||
|
border: 2px solid #d73f3f;
|
||
|
}
|