Help scrolls

[doneanddusted]

[nobr]
[class name=Header]
max-width: 700px;
margin: auto;
display: flex;
flex-direction: row;
justify-content: space-evenly;
align-items: center;
[/class]

[class name=Headshot]
height: 200px;
width: 200px;
background-image: url(https://via.placeholder.com/200);
background-size: 100%;
background-position: center center;
padding: 10px;
border-radius: 10px 50px;
[/class]

[class name=Heading]
font-size: 36pt;
font-family: Cinzel;
padding: 10px;
[/class]

[class name=Divide]
margin: auto;
text-align: center;
max-width: 100%
font-size: 12pt;
font-family: Cinzel;
[/class]

[class name=Background]
max-width: 800px;
height: 800px;
overflow: hidden;
margin: auto;
text-align: center;
[/class]

[class name=Scroller]
width: 100%;
height: 95%;
padding: 10px;
overflow-y: scroll;
display: flex;
flex-direction: column;
[/class]

[class name=Textbox]
width: 100%;
height: auto;
padding: 10px;
background-color: white;
text-align: justify;
color: black;
font-size: 12px;
font-family: Forum;
[/class]
[/nobr]

[div class=Header]
[div class=Headshot][/div]
[div class=Heading]Myesha Khalil[/div]
[/div]
[div class=Divide]⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⊰∙∘☽༓☾∘∙⊱⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅[/div]
[div class=Background][div class=Scroller]
[div class=Textbox]I'M BEESEXUAL.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc efficitur ut libero ac rhoncus. Curabitur eget sapien mattis, mollis justo fermentum, auctor arcu. Aenean nec fermentum neque. Fusce sodales diam scelerisque, rutrum nisl vel, finibus nunc. Sed eleifend neque id tincidunt pretium. Vestibulum sit amet lorem sed risus molestie vestibulum id ut neque. Nunc blandit erat eu sagittis euismod. Donec nec metus vitae lectus euismod convallis. Duis sagittis nec nulla sed malesuada. Integer ligula magna, tincidunt quis odio et, dignissim ullamcorper libero. Vestibulum ut mollis sapien, quis imperdiet ipsum. Vivamus fermentum tincidunt venenatis. Maecenas eget nibh at leo elementum mattis ut ut libero.
[/div]
[/div][/div]

and here's what it looks like:

Spoiler

[class name=Header] max-width: 700px; margin: auto; display: flex; flex-direction: row; justify-content: space-evenly; align-items: center; [/class] [class name=Headshot] height: 200px; width: 200px; background-image: url(https://via.placeholder.com/200); background-size: 100%; background-position: center center; padding: 10px; border-radius: 10px 50px; [/class] [class name=Heading] font-size: 36pt; font-family: Cinzel; padding: 10px; [/class] [class name=Divide] margin: auto; text-align: center; max-width: 100% font-size: 12pt; font-family: Cinzel; [/class] [class name=Background] max-width: 800px; height: 800px; overflow: hidden; margin: auto; text-align: center; [/class] [class name=Scroller] width: 100%; height: 95%; padding: 10px; overflow-y: scroll; display: flex; flex-direction: column; [/class] [class name=Textbox] width: 100%; height: auto; padding: 10px; background-color: white; text-align: justify; color: black; font-size: 12px; font-family: Forum; [/class]

[div class=Header]
[div class=Headshot][/div]
[div class=Heading]Myesha Khalil[/div]
[/div]
[div class=Divide]⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⊰∙∘☽༓☾∘∙⊱⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅[/div]
[div class=Background][div class=Scroller]
[div class=Textbox]I'M BEESEXUAL.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc efficitur ut libero ac rhoncus. Curabitur eget sapien mattis, mollis justo fermentum, auctor arcu. Aenean nec fermentum neque. Fusce sodales diam scelerisque, rutrum nisl vel, finibus nunc. Sed eleifend neque id tincidunt pretium. Vestibulum sit amet lorem sed risus molestie vestibulum id ut neque. Nunc blandit erat eu sagittis euismod. Donec nec metus vitae lectus euismod convallis. Duis sagittis nec nulla sed malesuada. Integer ligula magna, tincidunt quis odio et, dignissim ullamcorper libero. Vestibulum ut mollis sapien, quis imperdiet ipsum. Vivamus fermentum tincidunt venenatis. Maecenas eget nibh at leo elementum mattis ut ut libero.
[/div]
[/div][/div]

Anyway, I don't want the sideways scrollbar and I like have no idea how it happened. Could someone tell me what I might've done wrong and how I can fix it? Thanksss

 

[Alteras]

looks like its because of the padding in scroller that the text is getting pushed out. add box-sizing: border-box and overflow-x: none; to it.

 

[doneanddusted]

looks like its because of the padding in scroller that the text is getting pushed out. add box-sizing: border-box and overflow-x: none; to it.

okay, so i added that to the scroller class/function/thing but it's still the same. I removed overflow-x: none;, which kind of worked because there isn't a scroll but also that doesn't work because it's still cut off and there's that weird white line. (edit: nvm it doesn't do that anymore there's a scroll either way)

with code:

Spoiler

[class name=Header] max-width: 700px; margin: auto; display: flex; flex-direction: row; justify-content: space-evenly; align-items: center; [/class] [class name=Headshot] height: 200px; width: 200px; background-image: url(https://via.placeholder.com/200); background-size: 100%; background-position: center center; padding: 10px; border-radius: 10px 50px; [/class] [class name=Heading] font-size: 36pt; font-family: Cinzel; padding: 10px; [/class] [class name=Divide] margin: auto; text-align: center; max-width: 100% font-size: 12pt; font-family: Cinzel; [/class] [class name=Background] max-width: 800px; height: 800px; overflow: hidden; margin: auto; text-align: center; [/class] [class name=Scroller] width: 100%; height: 95%; padding: 10px; box-sizing: border-box overflow-x: none; overflow-y: scroll; display: flex; flex-direction: column; [/class] [class name=Textbox] width: 100%; height: auto; padding: 10px; background-color: white; text-align: justify; color: black; font-size: 12px; font-family: Forum; [/class]

[div class=Header]
[div class=Headshot][/div]
[div class=Heading]Myesha Khalil[/div]
[/div]
[div class=Divide]⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⊰∙∘☽༓☾∘∙⊱⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅[/div]
[div class=Background][div class=Scroller]
[div class=Textbox]I'M BEESEXUAL.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc efficitur ut libero ac rhoncus. Curabitur eget sapien mattis, mollis justo fermentum, auctor arcu. Aenean nec fermentum neque. Fusce sodales diam scelerisque, rutrum nisl vel, finibus nunc. Sed eleifend neque id tincidunt pretium. Vestibulum sit amet lorem sed risus molestie vestibulum id ut neque. Nunc blandit erat eu sagittis euismod. Donec nec metus vitae lectus euismod convallis. Duis sagittis nec nulla sed malesuada. Integer ligula magna, tincidunt quis odio et, dignissim ullamcorper libero. Vestibulum ut mollis sapien, quis imperdiet ipsum. Vivamus fermentum tincidunt venenatis. Maecenas eget nibh at leo elementum mattis ut ut libero.
[/div]
[/div][/div]

 

[Fable]

[class name=Header] max-width: 700px; margin: auto; display: flex; flex-direction: row; justify-content: space-evenly; align-items: center; [/class] [class name=Headshot] height: 200px; width: 200px; background-image: url(https://via.placeholder.com/200); background-size: 100%; background-position: center center; padding: 10px; border-radius: 10px 50px; [/class] [class name=Heading] font-size: 36pt; font-family: Cinzel; padding: 10px; [/class] [class name=Divide] margin: auto; text-align: center; max-width: 100% font-size: 12pt; font-family: Cinzel; [/class] [class name=Background] max-width: 800px; height: 800px; overflow: hidden; margin: auto; text-align: center; [/class] [class name=Scroller] width: 100%; height: 95%; padding: 10px; overflow-y: scroll; display: flex; flex-direction: column; [/class] [class name=Textbox] width: 100%; height: auto; padding: 10px; box-sizing:border-box; background-color: white; text-align: justify; color: black; font-size: 12px; font-family: Forum; [/class]

[div class=Header]
[div class=Headshot][/div]
[div class=Heading]Myesha Khalil[/div]
[/div]
[div class=Divide]⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⊰∙∘☽༓☾∘∙⊱⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅[/div]
[div class=Background][div class=Scroller]
[div class=Textbox]I'M BEESEXUAL.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc efficitur ut libero ac rhoncus. Curabitur eget sapien mattis, mollis justo fermentum, auctor arcu. Aenean nec fermentum neque. Fusce sodales diam scelerisque, rutrum nisl vel, finibus nunc. Sed eleifend neque id tincidunt pretium. Vestibulum sit amet lorem sed risus molestie vestibulum id ut neque. Nunc blandit erat eu sagittis euismod. Donec nec metus vitae lectus euismod convallis. Duis sagittis nec nulla sed malesuada. Integer ligula magna, tincidunt quis odio et, dignissim ullamcorper libero. Vestibulum ut mollis sapien, quis imperdiet ipsum. Vivamus fermentum tincidunt venenatis. Maecenas eget nibh at leo elementum mattis ut ut libero.
[/div]
[/div][/div]

Spoiler

[nobr]
[class name=Header]
max-width: 700px;
margin: auto;
display: flex;
flex-direction: row;
justify-content: space-evenly;
align-items: center;
[/class]

[class name=Headshot]
height: 200px;
width: 200px;
background-image: url(https://via.placeholder.com/200);
background-size: 100%;
background-position: center center;
padding: 10px;
border-radius: 10px 50px;
[/class]

[class name=Heading]
font-size: 36pt;
font-family: Cinzel;
padding: 10px;
[/class]

[class name=Divide]
margin: auto;
text-align: center;
max-width: 100%
font-size: 12pt;
font-family: Cinzel;
[/class]

[class name=Background]
max-width: 800px;
height: 800px;
overflow: hidden;
margin: auto;
text-align: center;
[/class]

[class name=Scroller]
width: 100%;
height: 95%;
padding: 10px;
overflow-y: scroll;
display: flex;
flex-direction: column;
[/class]

[class name=Textbox]
width: 100%;
height: auto;
padding: 10px;
box-sizing:border-box;
background-color: white;
text-align: justify;
color: black;
font-size: 12px;
font-family: Forum;
[/class]
[/nobr]

[div class=Header]
[div class=Headshot][/div]
[div class=Heading]Myesha Khalil[/div]
[/div]
[div class=Divide]⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⊰∙∘☽༓☾∘∙⊱⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅[/div]
[div class=Background][div class=Scroller]
[div class=Textbox]I'M BEESEXUAL.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc efficitur ut libero ac rhoncus. Curabitur eget sapien mattis, mollis justo fermentum, auctor arcu. Aenean nec fermentum neque. Fusce sodales diam scelerisque, rutrum nisl vel, finibus nunc. Sed eleifend neque id tincidunt pretium. Vestibulum sit amet lorem sed risus molestie vestibulum id ut neque. Nunc blandit erat eu sagittis euismod. Donec nec metus vitae lectus euismod convallis. Duis sagittis nec nulla sed malesuada. Integer ligula magna, tincidunt quis odio et, dignissim ullamcorper libero. Vestibulum ut mollis sapien, quis imperdiet ipsum. Vivamus fermentum tincidunt venenatis. Maecenas eget nibh at leo elementum mattis ut ut libero.
[/div]
[/div][/div]

You put it in the wrong class.

 

[doneanddusted]

[class name=Header] max-width: 700px; margin: auto; display: flex; flex-direction: row; justify-content: space-evenly; align-items: center; [/class] [class name=Headshot] height: 200px; width: 200px; background-image: url(https://via.placeholder.com/200); background-size: 100%; background-position: center center; padding: 10px; border-radius: 10px 50px; [/class] [class name=Heading] font-size: 36pt; font-family: Cinzel; padding: 10px; [/class] [class name=Divide] margin: auto; text-align: center; max-width: 100% font-size: 12pt; font-family: Cinzel; [/class] [class name=Background] max-width: 800px; height: 800px; overflow: hidden; margin: auto; text-align: center; [/class] [class name=Scroller] width: 100%; height: 95%; padding: 10px; overflow-y: scroll; display: flex; flex-direction: column; [/class] [class name=Textbox] width: 100%; height: auto; padding: 10px; box-sizing:border-box; background-color: white; text-align: justify; color: black; font-size: 12px; font-family: Forum; [/class]

[div class=Header]
[div class=Headshot][/div]
[div class=Heading]Myesha Khalil[/div]
[/div]
[div class=Divide]⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⊰∙∘☽༓☾∘∙⊱⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅[/div]
[div class=Background][div class=Scroller]
[div class=Textbox]I'M BEESEXUAL.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc efficitur ut libero ac rhoncus. Curabitur eget sapien mattis, mollis justo fermentum, auctor arcu. Aenean nec fermentum neque. Fusce sodales diam scelerisque, rutrum nisl vel, finibus nunc. Sed eleifend neque id tincidunt pretium. Vestibulum sit amet lorem sed risus molestie vestibulum id ut neque. Nunc blandit erat eu sagittis euismod. Donec nec metus vitae lectus euismod convallis. Duis sagittis nec nulla sed malesuada. Integer ligula magna, tincidunt quis odio et, dignissim ullamcorper libero. Vestibulum ut mollis sapien, quis imperdiet ipsum. Vivamus fermentum tincidunt venenatis. Maecenas eget nibh at leo elementum mattis ut ut libero.
[/div]
[/div][/div]

Spoiler

[nobr]
[class name=Header]
max-width: 700px;
margin: auto;
display: flex;
flex-direction: row;
justify-content: space-evenly;
align-items: center;
[/class]

[class name=Headshot]
height: 200px;
width: 200px;
background-image: url(https://via.placeholder.com/200);
background-size: 100%;
background-position: center center;
padding: 10px;
border-radius: 10px 50px;
[/class]

[class name=Heading]
font-size: 36pt;
font-family: Cinzel;
padding: 10px;
[/class]

[class name=Divide]
margin: auto;
text-align: center;
max-width: 100%
font-size: 12pt;
font-family: Cinzel;
[/class]

[class name=Background]
max-width: 800px;
height: 800px;
overflow: hidden;
margin: auto;
text-align: center;
[/class]

[class name=Scroller]
width: 100%;
height: 95%;
padding: 10px;
overflow-y: scroll;
display: flex;
flex-direction: column;
[/class]

[class name=Textbox]
width: 100%;
height: auto;
padding: 10px;
box-sizing:border-box;
background-color: white;
text-align: justify;
color: black;
font-size: 12px;
font-family: Forum;
[/class]
[/nobr]

[div class=Header]
[div class=Headshot][/div]
[div class=Heading]Myesha Khalil[/div]
[/div]
[div class=Divide]⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⊰∙∘☽༓☾∘∙⊱⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅⋅•⋅[/div]
[div class=Background][div class=Scroller]
[div class=Textbox]I'M BEESEXUAL.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc efficitur ut libero ac rhoncus. Curabitur eget sapien mattis, mollis justo fermentum, auctor arcu. Aenean nec fermentum neque. Fusce sodales diam scelerisque, rutrum nisl vel, finibus nunc. Sed eleifend neque id tincidunt pretium. Vestibulum sit amet lorem sed risus molestie vestibulum id ut neque. Nunc blandit erat eu sagittis euismod. Donec nec metus vitae lectus euismod convallis. Duis sagittis nec nulla sed malesuada. Integer ligula magna, tincidunt quis odio et, dignissim ullamcorper libero. Vestibulum ut mollis sapien, quis imperdiet ipsum. Vivamus fermentum tincidunt venenatis. Maecenas eget nibh at leo elementum mattis ut ut libero.
[/div]
[/div][/div]

You put it in the wrong class.

(sorry for the very VERY late reply)

omg thank you! is there anything that could be done about the vertical line on the right? I have no idea how it happened

 

[Fable]

(sorry for the very VERY late reply)

omg thank you! is there anything that could be done about the vertical line on the right? I have no idea how it happened

Er, I don't see a vertical line. O-o;