arctic
rattpack
So I'm trying to add anchors to my code, but without the blue of the links and well...it's messing up in a lot of weird ways. For one, the target code is overriding the position: sticky bit inside a div box? It's also shifting around text?
Code without the anchors:
Code with anchors:
Code without the anchors:
Now or never
General
Appearance
Persona
Backstory
general
Code:
[div=
width: 90%;
height: 100%;
background: url(https://i.imgur.com/kGs8XlP.jpg);
margin: auto;
display: flex;
justify-content: flex-start;
align-items: center;
flex-flow: column wrap;
overflow: hidden;][div=
width: 65%;
margin-top: 5%;
font: italic 50px arial, sans-serif;
font-weight: 750;
letter-spacing: 3px;
text-align: center;
text-shadow: 5px 5px black;
text-transform: lowercase;
color: white;
padding: 3px;]Now or never[div=
width: 100%;
display: flex;
flex-flow: row wrap;
justify-content: center;
align-items: flex start;][div=
width: 85px;
font: italic 10px arial, sans-serif;
color: white;
text-shadow: 1px 1px black;
text-transform: lowercase;
padding: 2px;]General[/div][div=
width: 85px;
font: italic 10px arial, sans-serif;
color: white;
text-shadow: 1px 1px black;
text-transform: lowercase;
padding: 2px;]Appearance[/div][div=
width: 85px;
font: italic 10px arial, sans-serif;
color: white;
text-shadow: 1px 1px black;
text-transform: lowercase;
flex-shrink: 0;]Persona[/div][div=
width: 85px;
font: italic 10px arial, sans-serif;
color: white;
text-shadow: 1px 1px black;
text-transform: lowercase;
padding: 2px;]Backstory[/div][/div][/div][div=
width: calc(70% - 20px);
height: 340px;
margin-top: 2%;
margin-bottom: 5%;
padding: 10px;
overflow: hidden;][div=
width: 100%;
padding-right: 150px;
height: 100%;
overflow-y: scroll;][div=
height: 500px;
width: 100%;][/div][div=
height: 1000px;
width: 100%;
background: #FFFFF0;
padding: 0px 4px;][div=
position: sticky;
top: 0px;
background: #FFFFF0;]general[/div][/div][div=
height: 500px;
width: 100%;][/div][/div][/div][/div]
Code with anchors:
Code:
[div=
width: 90%;
height: 100%;
background: url(https://i.imgur.com/kGs8XlP.jpg);
margin: auto;
display: flex;
justify-content: flex-start;
align-items: center;
flex-flow: column wrap;
overflow: hidden;][div=
flex-shrink: 1;
width: 65%;
margin-top: 5%;
font: italic 50px arial, sans-serif;
font-weight: 750;
letter-spacing: 3px;
text-align: center;
text-shadow: 5px 5px black;
text-transform: lowercase;
color: white;
padding: 3px;]Now or never[div=
width: 100%;
display: flex;
flex-flow: row wrap;
justify-content: center;
align-items: flex start;][div= visibilty: hidden;][GOTO=general][div=
visibiliity: visible;
width: 85px;
font: italic 10px arial, sans-serif;
color: white;
text-shadow: 1px 1px black;
text-transform: lowercase;]General[/div][/GOTO][/div][div=
width: 85px;
font: italic 10px arial, sans-serif;
color: white;
text-shadow: 1px 1px black;
text-transform: lowercase;]Appearance[/div][div=
width: 85px;
font: italic 10px arial, sans-serif;
color: white;
text-shadow: 1px 1px black;
text-transform: lowercase;]Persona[/div][div=
width: 85px;
font: italic 10px arial, sans-serif;
color: white;
text-shadow: 1px 1px black;
text-transform: lowercase;]Backstory[/div][/div][/div][div=
width: calc(70% - 20px);
height: 340px;
margin-top: 2%;
margin-bottom: 5%;
padding: 10px;
overflow: hidden;][div=
width: 100%;
padding-right: 150px;
height: 100%;
overflow-y: scroll;][div=
height: 500px;
width: 100%;][/div][div=
height: 1000px;
width: 100%;
background: #FFFFF0;
padding: 0px 4px;][div=visibility: hidden;][A=general][div=
visibility: visible;
position: sticky;
top: 0px;
color: black;
background: #FFFFF0;]general[/div][/A][/div][/div][div=
height: 500px;
width: 100%;][/div][/div][/div][/div]