User:Kivik/sandbox2: Difference between revisions

Jump to navigation Jump to search
m
Shifting title into container. Will likely need to adjust styling
m (Split portrait classes into two (one normal and one centered vertically) to allow some flexibility)
m (Shifting title into container. Will likely need to adjust styling)
Line 1: Line 1:
{{#css:  
{{#css:  
.relationships-title { background-color: steelblue; color: white; font-weight: bold; font-size: 1.5em; border-radius: 0 1em 0 0; padding-left: 1em; }
.relationships-container { background-color: white; padding: .5em; border-radius: 1em 1em 1.5em 1.5em; border: 3px solid steelblue; display: flex; flex-flow: row wrap; justify-content: space-evenly; min-width: fit-content; }
.relationships-container { background-color: white; padding: .5em; border-radius: 0 0 1.5em 1.5em; border: 3px solid steelblue; display: flex; flex-flow: row wrap; justify-content: space-evenly; min-width: fit-content; }
.relationships-title { background-color: steelblue; color: white; font-weight: bold; font-size: 1.5em; padding-left: .5em; }
.relationships-entry { min-width: 400px; margin: .5em; padding: 1em; background-color: #f0f0f0; border-radius: 1em; flex-basis: 25%; flex-grow: 1; }
.relationships-entry { min-width: 400px; margin: .5em; padding: 1em; background-color: #f0f0f0; border-radius: 1em; flex-basis: 25%; flex-grow: 1; }
.relationships-portrait-box { margin-bottom: .5em; display: flex; justify-content: center; }
.relationships-portrait-box { margin-bottom: .5em; display: flex; justify-content: center; }
Line 9: Line 9:
}}
}}


<!-- Start Container--><div class="relationships-container">
<div class="relationships-title">Close Relationships</div>
<div class="relationships-title">Close Relationships</div>
<!-- Start Container--><div class="relationships-container">
 
<!-- Start-Entry --><div class="relationships-entry"id="N-Richards">
<!-- Start-Entry --><div class="relationships-entry"id="N-Richards">
<!-- Start-Portrait(s) --><div class="relationships-portrait-box">
<!-- Start-Portrait(s) --><div class="relationships-portrait-box">

Navigation menu