• When posting, please be aware that artistic nudity is still nudity and not allowed under RpNation rules. Please edit your pictures accordingly!

    Remember to credit artists when using work not your own.

Help Failed BBCode, tips to make it work?

Roleplay Availability
Roleplay Type(s)
So today I was trying to make one of those in character sheets. But when I previewed it, I found I failed miserably. I think my main problem was with the positioning of the images, and scroll bars, and the quotation. For some reason it just wouldn't work the way I wanted it. I actually, wanted to make something like
u7j7Zer.jpg
however, the code didn't turn out as planned. So if any of you guys skilled at bbcoding could take a look at the code and give me some tips I'd really appreciate it. Cause I do want to make this code, workable and usable.
[class=background] position: relative; box-sizing: border-box; width: 240px; height: 320px; background-color:#E8E8E8; overflow: hidden; margin-right:auto; margin-left:auto; padding:0; [/class] [class=Text_Box] position: relative; overflow: auto; width: 110px; height: 237px; font size; 10px; padding: 10px; color:#E8E8E8; [/class] [class=Text_container] position: absolute; overflow: hidden; width: 110px; height: 237px; left: 114px; top: 24px; background-color:#6A8E8E; border: 4px solid #8BA0B3; [/class] [class=Image_3] position: absolute; overflow: visible; width: 69px; height: 69px; left: 24px; top: 42px; background:url(https://66.media.tumblr.com/85ca252a623eeb5c83d74f47575badb7/tumblr_pmrrgerICu1vxt811_540.jpg); background-position: center; background-size:75%; border:4px solid #8BA0B3; [/class] .Image_2 { position: absolute; overflow: visible; width: 69px; height: 69px; left: 6px; top: 81px; background:url(https://66.media.tumblr.com/b32fd70bfd3d05cdef495d6562119cc3/tumblr_pmrrgeqrPK1vxt811_540.jpg); background-size: 100%; border:4px solid #8BA0B3; [/class] [class= Image_1] position: absolute; overflow: visible; width: 69px; height: 69px; left: 24px; top: 129px; background:url(https://66.media.tumblr.com/ca62ccf25595a503bf0e7bb30b8bfaaa/tumblr_pmrrgfdQQR1vxt811_540.jpg); background-size; 25%; border:4px solid #8BA0B3; [/class] [class=Text_or_quote_here] position: absolute; overflow:visible; left: 6px; top: 210px; width: 111px; height: 94px; text-align:center; font-weight: 200; font-size: 17px; color:#6A8E8E; [/class] [class=button_1] position: absolute; overflow: visible; width: 22px; height: 20px; left: 123px; top: 275px; background:url(https://imgur.com/2oN2mM2) [/class] [class=.button_3] position: absolute; overflow: visible; width: 22px; height: 20px; left: 191px; top: 275px; background:url() [/class] [class=button_2] position: absolute; overflow: visible; width: 32px; height: 21px; left: 152px; top: 274px; background:url(https://imgur.com/RRxsOEE) [/class]
[div class=background]
[div class=Text_Container">[div class=Text_Box">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ac auctor augue mauris augue neque gravida in. Viverra nam libero justo laoreet sit amet cursus. Euismod elementum nisi quis eleifend quam adipiscing vitae. Facilisis gravida neque convallis a cras semper auctor. Dictumst quisque sagittis purus sit. Ut ornare lectus sit amet est placerat in egestas. Id semper risus in hendrerit gravida rutrum quisque non tellus. Vitae aliquet nec ullamcorper sit amet. Id semper risus in hendrerit gravida rutrum quisque non. Mi quis hendrerit dolor magna eget est. Facilisi morbi tempus iaculis urna id. Fames ac turpis egestas integer eget aliquet nibh. Tortor posuere ac ut consequat semper viverra nam libero.

Quisque sagittis purus sit amet volutpat consequat. Ipsum nunc aliquet bibendum enim facilisis gravida neque convallis a. Arcu dui vivamus arcu felis bibendum ut tristique et. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae. Et malesuada fames ac turpis egestas. Risus feugiat in ante metus dictum at tempor commodo. Mattis nunc sed blandit libero volutpat sed cras ornare arcu. Diam maecenas sed enim ut sem viverra. Elementum facilisis leo vel fringilla est ullamcorper eget nulla facilisi. Amet dictum sit amet justo donec enim diam vulputate ut.

Aliquam sem fringilla ut morbi tincidunt augue. Et molestie ac feugiat sed. Vitae turpis massa sed elementum tempus egestas sed sed risus. In metus vulputate eu scelerisque felis imperdiet proin fermentum. Enim blandit volutpat maecenas volutpat blandit. Ultricies lacus sed turpis tincidunt id aliquet risus. Feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Eget mi proin sed libero enim. In arcu cursus euismod quis viverra nibh cras pulvinar. Sed augue lacus viverra vitae congue eu consequat. Nascetur ridiculus mus mauris vitae ultricies leo integer malesuada nunc. Morbi tincidunt augue interdum velit euismod. Suspendisse sed nisi lacus sed viverra tellus in hac.

Cras adipiscing enim eu turpis egestas pretium aenean. Duis at tellus at urna condimentum mattis pellentesque id. Sodales ut etiam sit amet nisl purus. Vel turpis nunc eget lorem dolor sed. Sed vulputate mi sit amet mauris commodo quis imperdiet massa. Vel pretium lectus quam id leo. Diam quis enim lobortis scelerisque fermentum dui. Nec ultrices dui sapien eget mi proin sed libero enim. At auctor urna nunc id. Massa placerat duis ultricies lacus sed turpis. Augue ut lectus arcu bibendum at varius vel. Lectus magna fringilla urna porttitor rhoncus dolor. Neque gravida in fermentum et sollicitudin ac orci phasellus egestas. Viverra maecenas accumsan lacus vel facilisis volutpat. In massa tempor nec feugiat. Non blandit massa enim nec. A pellentesque sit amet porttitor eget dolor morbi. Non enim praesent elementum facilisis leo vel fringilla est ullamcorper.

Maecenas ultricies mi eget mauris pharetra. Sit amet risus nullam eget. Diam sollicitudin tempor id eu. At in tellus integer feugiat scelerisque varius morbi enim nunc. Sit amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Ac ut consequat semper viverra nam libero justo. Nulla facilisi cras fermentum odio eu feugiat pretium nibh. Dui id ornare arcu odio ut. Suspendisse in est ante in nibh mauris cursus mattis molestie. Sed odio morbi quis commodo odio. Sit amet nisl suscipit adipiscing bibendum est ultricies. Quisque sagittis purus sit amet volutpat consequat mauris. Dignissim diam quis enim lobortis scelerisque fermentum dui faucibus in. Massa tincidunt dui ut ornare. At varius vel pharetra vel turpis. Vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras tincidunt lobortis.[/class][/class]
[div class=Image_3] [/class]
[div class=Image_2] [/class]
[div class=Image_1] [/class]
[div class="Text_or_quote_here]"Eternity ends and begins with the ocean's tides"[/class]
[div class=button_1] [/class]
[div class=button_3] [/class]
[div class=button_2] [/class]
[/div][/div][/div][/div][/div][/div][/div][/div][/div]
[div class=background][div class=Text_Container">[div class=Text_Box">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ac auctor augue mauris augue neque gravida in. Viverra nam libero justo laoreet sit amet cursus. Euismod elementum nisi quis eleifend quam adipiscing vitae. Facilisis gravida neque convallis a cras semper auctor. Dictumst quisque sagittis purus sit. Ut ornare lectus sit amet est placerat in egestas. Id semper risus in hendrerit gravida rutrum quisque non tellus. Vitae aliquet nec ullamcorper sit amet. Id semper risus in hendrerit gravida rutrum quisque non. Mi quis hendrerit dolor magna eget est. Facilisi morbi tempus iaculis urna id. Fames ac turpis egestas integer eget aliquet nibh. Tortor posuere ac ut consequat semper viverra nam libero.

Quisque sagittis purus sit amet volutpat consequat. Ipsum nunc aliquet bibendum enim facilisis gravida neque convallis a. Arcu dui vivamus arcu felis bibendum ut tristique et. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae. Et malesuada fames ac turpis egestas. Risus feugiat in ante metus dictum at tempor commodo. Mattis nunc sed blandit libero volutpat sed cras ornare arcu. Diam maecenas sed enim ut sem viverra. Elementum facilisis leo vel fringilla est ullamcorper eget nulla facilisi. Amet dictum sit amet justo donec enim diam vulputate ut.

Aliquam sem fringilla ut morbi tincidunt augue. Et molestie ac feugiat sed. Vitae turpis massa sed elementum tempus egestas sed sed risus. In metus vulputate eu scelerisque felis imperdiet proin fermentum. Enim blandit volutpat maecenas volutpat blandit. Ultricies lacus sed turpis tincidunt id aliquet risus. Feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Eget mi proin sed libero enim. In arcu cursus euismod quis viverra nibh cras pulvinar. Sed augue lacus viverra vitae congue eu consequat. Nascetur ridiculus mus mauris vitae ultricies leo integer malesuada nunc. Morbi tincidunt augue interdum velit euismod. Suspendisse sed nisi lacus sed viverra tellus in hac.

Cras adipiscing enim eu turpis egestas pretium aenean. Duis at tellus at urna condimentum mattis pellentesque id. Sodales ut etiam sit amet nisl purus. Vel turpis nunc eget lorem dolor sed. Sed vulputate mi sit amet mauris commodo quis imperdiet massa. Vel pretium lectus quam id leo. Diam quis enim lobortis scelerisque fermentum dui. Nec ultrices dui sapien eget mi proin sed libero enim. At auctor urna nunc id. Massa placerat duis ultricies lacus sed turpis. Augue ut lectus arcu bibendum at varius vel. Lectus magna fringilla urna porttitor rhoncus dolor. Neque gravida in fermentum et sollicitudin ac orci phasellus egestas. Viverra maecenas accumsan lacus vel facilisis volutpat. In massa tempor nec feugiat. Non blandit massa enim nec. A pellentesque sit amet porttitor eget dolor morbi. Non enim praesent elementum facilisis leo vel fringilla est ullamcorper.

Maecenas ultricies mi eget mauris pharetra. Sit amet risus nullam eget. Diam sollicitudin tempor id eu. At in tellus integer feugiat scelerisque varius morbi enim nunc. Sit amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Ac ut consequat semper viverra nam libero justo. Nulla facilisi cras fermentum odio eu feugiat pretium nibh. Dui id ornare arcu odio ut. Suspendisse in est ante in nibh mauris cursus mattis molestie. Sed odio morbi quis commodo odio. Sit amet nisl suscipit adipiscing bibendum est ultricies. Quisque sagittis purus sit amet volutpat consequat mauris. Dignissim diam quis enim lobortis scelerisque fermentum dui faucibus in. Massa tincidunt dui ut ornare. At varius vel pharetra vel turpis. Vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras tincidunt lobortis.[/class][div class=Image_3][div class=Image_2][div class=Image_1][div class="Text_or_quote_here][div class=button_1][div class=button_3][div class=button_2][/div][/div][/div][/div][/div][/div][/div][/div][/div]
 
Uhhh, so you can use the tag [code][/code] to post raw post.

It's difficult for me to see, but are you using position absolute? If so, did you make sure it is all inside a div with position relative?
 
Uhhh, so you can use the tag [code][/code] to post raw post.

It's difficult for me to see, but are you using position absolute? If so, did you make sure it is all inside a div with position relative?
Ah, I’ll do that😂 hold on, cause I wanted it to be hidden, still but yeah, that would probably be helpful wouldn’t it.
 
Ok so here is the raw code
here
Code:
[nobr]
	[class=background]
		position: relative;
		box-sizing: border-box;
		width: 240px;
		height: 320px;
		background-color:#E8E8E8;
		overflow: hidden;
		margin-right:auto;
		margin-left:auto;
		padding:0;
		
	[/class]
	[class=Text_Box]
		position: relative;
		overflow: auto;
		width: 110px;
		height: 237px;
		font size; 10px;
		padding: 10px;
		color:#E8E8E8;
	[/class]
	[class=Text_container]
		position: absolute;
		overflow: hidden;
		width: 110px;
		height: 237px;
		left: 114px;
		top: 24px;
		background-color:#6A8E8E;
		border: 4px solid #8BA0B3;
	[/class]
	[class=Image_3]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 24px;
		top: 42px;
		background:url(https://66.media.tumblr.com/85ca252a623eeb5c83d74f47575badb7/tumblr_pmrrgerICu1vxt811_540.jpg);
		background-position: center;
		background-size:75%;
		border:4px solid #8BA0B3;
	[/class]
	.Image_2 {
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 6px;
		top: 81px;
    background:url(https://66.media.tumblr.com/b32fd70bfd3d05cdef495d6562119cc3/tumblr_pmrrgeqrPK1vxt811_540.jpg);
		background-size: 100%;
		border:4px solid #8BA0B3;
	[/class]
	[class= Image_1]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 24px;
		top: 129px;
		background:url(https://66.media.tumblr.com/ca62ccf25595a503bf0e7bb30b8bfaaa/tumblr_pmrrgfdQQR1vxt811_540.jpg);
		background-size; 25%;
		border:4px solid #8BA0B3;
	[/class]
	[class=Text_or_quote_here]
		position: absolute;
		overflow:visible;
		left: 6px;
		top: 210px;
		width: 111px;
		height: 94px;
		text-align:center;
		font-weight: 200;
		font-size: 17px;
		color:#6A8E8E;
	[/class]
	[class=button_1]
		position: absolute;
		overflow: visible;
		width: 22px;
		height: 20px;
		left: 123px;
		top: 275px;
		background:url(https://imgur.com/2oN2mM2)
	[/class]
	[class=.button_3]
		position: absolute;
		overflow: visible;
		width: 22px;
		height: 20px;
		left: 191px;
		top: 275px;
		background:url(https://imgur.com/2oN2mM2)
	[/class]
	[class=button_2]
		position: absolute;
		overflow: visible;
		width: 32px;
		height: 21px;
		left: 152px;
		top: 274px;
		background:url(https://imgur.com/RRxsOEE)
	[/class][/nobr]
[div class=background]
  [div class=Text_Container">[div class=Text_Box">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ac auctor augue mauris augue neque gravida in. Viverra nam libero justo laoreet sit amet cursus. Euismod elementum nisi quis eleifend quam adipiscing vitae. Facilisis gravida neque convallis a cras semper auctor. Dictumst quisque sagittis purus sit. Ut ornare lectus sit amet est placerat in egestas. Id semper risus in hendrerit gravida rutrum quisque non tellus. Vitae aliquet nec ullamcorper sit amet. Id semper risus in hendrerit gravida rutrum quisque non. Mi quis hendrerit dolor magna eget est. Facilisi morbi tempus iaculis urna id. Fames ac turpis egestas integer eget aliquet nibh. Tortor posuere ac ut consequat semper viverra nam libero.

Quisque sagittis purus sit amet volutpat consequat. Ipsum nunc aliquet bibendum enim facilisis gravida neque convallis a. Arcu dui vivamus arcu felis bibendum ut tristique et. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae. Et malesuada fames ac turpis egestas. Risus feugiat in ante metus dictum at tempor commodo. Mattis nunc sed blandit libero volutpat sed cras ornare arcu. Diam maecenas sed enim ut sem viverra. Elementum facilisis leo vel fringilla est ullamcorper eget nulla facilisi. Amet dictum sit amet justo donec enim diam vulputate ut.

Aliquam sem fringilla ut morbi tincidunt augue. Et molestie ac feugiat sed. Vitae turpis massa sed elementum tempus egestas sed sed risus. In metus vulputate eu scelerisque felis imperdiet proin fermentum. Enim blandit volutpat maecenas volutpat blandit. Ultricies lacus sed turpis tincidunt id aliquet risus. Feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Eget mi proin sed libero enim. In arcu cursus euismod quis viverra nibh cras pulvinar. Sed augue lacus viverra vitae congue eu consequat. Nascetur ridiculus mus mauris vitae ultricies leo integer malesuada nunc. Morbi tincidunt augue interdum velit euismod. Suspendisse sed nisi lacus sed viverra tellus in hac.

Cras adipiscing enim eu turpis egestas pretium aenean. Duis at tellus at urna condimentum mattis pellentesque id. Sodales ut etiam sit amet nisl purus. Vel turpis nunc eget lorem dolor sed. Sed vulputate mi sit amet mauris commodo quis imperdiet massa. Vel pretium lectus quam id leo. Diam quis enim lobortis scelerisque fermentum dui. Nec ultrices dui sapien eget mi proin sed libero enim. At auctor urna nunc id. Massa placerat duis ultricies lacus sed turpis. Augue ut lectus arcu bibendum at varius vel. Lectus magna fringilla urna porttitor rhoncus dolor. Neque gravida in fermentum et sollicitudin ac orci phasellus egestas. Viverra maecenas accumsan lacus vel facilisis volutpat. In massa tempor nec feugiat. Non blandit massa enim nec. A pellentesque sit amet porttitor eget dolor morbi. Non enim praesent elementum facilisis leo vel fringilla est ullamcorper.

Maecenas ultricies mi eget mauris pharetra. Sit amet risus nullam eget. Diam sollicitudin tempor id eu. At in tellus integer feugiat scelerisque varius morbi enim nunc. Sit amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Ac ut consequat semper viverra nam libero justo. Nulla facilisi cras fermentum odio eu feugiat pretium nibh. Dui id ornare arcu odio ut. Suspendisse in est ante in nibh mauris cursus mattis molestie. Sed odio morbi quis commodo odio. Sit amet nisl suscipit adipiscing bibendum est ultricies. Quisque sagittis purus sit amet volutpat consequat mauris. Dignissim diam quis enim lobortis scelerisque fermentum dui faucibus in. Massa tincidunt dui ut ornare. At varius vel pharetra vel turpis. Vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras tincidunt lobortis.[/class][/class]
  [div class=Image_3] [/class]
  [div class=Image_2] [/class]
  [div class=Image_1] [/class]
  [div class="Text_or_quote_here]"Eternity ends and begins with the ocean's tides"[/class]
  [div class=button_1] [/class]
  [div class=button_3] [/class]
  [div class=button_2] [/class]
 
Looks like you accidentally closed your divs with [/class] instead of [/div]. That should fix your problems.
 
So I changed all the [/class] to [/div] but for some reason it still isn't showing up properly? And now the code looks like this
Idk what I even did
Code:
[nobr]
	[class=background]
		position: relative;
		box-sizing: border-box;
		width: 240px;
		height: 320px;
                overflow: hidden;
		background-color:#E8E8E8;
		margin-right:auto;
		margin-left:auto;
                padding: 0px
	
	[/class]
	[class=Text_Box]
		position: relative;
		overflow: auto;
		width: 110px;
		height: 237px;
		font size; 10px;
		padding: 10px;
		color:#E8E8E8;
	[/class]
	[class=Text_container]
		position: absolute;
		overflow: hidden;
		width: 110px;
		height: 237px;
		left: 114px;
		top: 24px;
		background-color:#6A8E8E;
		border: 4px solid #8BA0B3;
	[/class]
	[class=Image_3]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 24px;
		top: 42px;
background:url(https://66.media.tumblr.com/85ca252a623eeb5c83d74f47575badb7/tumblr_pmrrgerICu1vxt811_540.jpg);
		background-position: center;
		background-size:75%;
		border:4px solid #8BA0B3;
	[/class]
	[class=Image_2]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 6px;
		top: 81px;
background:url(https://66.media.tumblr.com/b32fd70bfd3d05cdef495d6562119cc3/tumblr_pmrrgeqrPK1vxt811_540.jpg);
		background-size: 100%;
		border:4px solid #8BA0B3;
	[/class]
	[class= Image_1]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 24px;
		top: 129px;
background:url(https://66.media.tumblr.com/ca62ccf25595a503bf0e7bb30b8bfaaa/tumblr_pmrrgfdQQR1vxt811_540.jpg);
		background-size; 25%;
		border:4px solid #8BA0B3;
	[/class]
	[class=Text_or_quote_here]
		position: absolute;
		overflow:visible;
		left: 6px;
		top: 210px;
		width: 111px;
		height: 94px;
		text-align:center;
		font-weight: 200;
		font-size: 17px;
		color:#6A8E8E;
	[/class]
	[class=button_1]
		position: absolute;
		overflow: visible;
		width: 22px;
		height: 20px;
		left: 123px;
		top: 275px;
background:url(https://imgur.com/2oN2mM2)
	[/class]
	[class=.button_3]
		position: absolute;
		overflow: visible;
		width: 22px;
		height: 20px;
		left: 191px;
		top: 275px;
background:url(https://imgur.com/2oN2mM2)
	[/class]
	[class=button_2]
		position: absolute;
		overflow: visible;
		width: 32px;
		height: 21px;
		left: 152px;
		top: 274px;
background:url(https://imgur.com/RRxsOEE)
	[/class][/nobr]
[div class=background]
  [div class=Text_Container">[div class=Text_Box"]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ac auctor augue mauris augue neque gravida in. Viverra nam libero justo laoreet sit amet cursus. Euismod elementum nisi quis eleifend quam adipiscing vitae. Facilisis gravida neque convallis a cras semper auctor. Dictumst quisque sagittis purus sit. Ut ornare lectus sit amet est placerat in egestas. Id semper risus in hendrerit gravida rutrum quisque non tellus. Vitae aliquet nec ullamcorper sit amet. Id semper risus in hendrerit gravida rutrum quisque non. Mi quis hendrerit dolor magna eget est. Facilisi morbi tempus iaculis urna id. Fames ac turpis egestas integer eget aliquet nibh. Tortor posuere ac ut consequat semper viverra nam libero.

Quisque sagittis purus sit amet volutpat consequat. Ipsum nunc aliquet bibendum enim facilisis gravida neque convallis a. Arcu dui vivamus arcu felis bibendum ut tristique et. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae. Et malesuada fames ac turpis egestas. Risus feugiat in ante metus dictum at tempor commodo. Mattis nunc sed blandit libero volutpat sed cras ornare arcu. Diam maecenas sed enim ut sem viverra. Elementum facilisis leo vel fringilla est ullamcorper eget nulla facilisi. Amet dictum sit amet justo donec enim diam vulputate ut.

Aliquam sem fringilla ut morbi tincidunt augue. Et molestie ac feugiat sed. Vitae turpis massa sed elementum tempus egestas sed sed risus. In metus vulputate eu scelerisque felis imperdiet proin fermentum. Enim blandit volutpat maecenas volutpat blandit. Ultricies lacus sed turpis tincidunt id aliquet risus. Feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Eget mi proin sed libero enim. In arcu cursus euismod quis viverra nibh cras pulvinar. Sed augue lacus viverra vitae congue eu consequat. Nascetur ridiculus mus mauris vitae ultricies leo integer malesuada nunc. Morbi tincidunt augue interdum velit euismod. Suspendisse sed nisi lacus sed viverra tellus in hac.

Cras adipiscing enim eu turpis egestas pretium aenean. Duis at tellus at urna condimentum mattis pellentesque id. Sodales ut etiam sit amet nisl purus. Vel turpis nunc eget lorem dolor sed. Sed vulputate mi sit amet mauris commodo quis imperdiet massa. Vel pretium lectus quam id leo. Diam quis enim lobortis scelerisque fermentum dui. Nec ultrices dui sapien eget mi proin sed libero enim. At auctor urna nunc id. Massa placerat duis ultricies lacus sed turpis. Augue ut lectus arcu bibendum at varius vel. Lectus magna fringilla urna porttitor rhoncus dolor. Neque gravida in fermentum et sollicitudin ac orci phasellus egestas. Viverra maecenas accumsan lacus vel facilisis volutpat. In massa tempor nec feugiat. Non blandit massa enim nec. A pellentesque sit amet porttitor eget dolor morbi. Non enim praesent elementum facilisis leo vel fringilla est ullamcorper.

Maecenas ultricies mi eget mauris pharetra. Sit amet risus nullam eget. Diam sollicitudin tempor id eu. At in tellus integer feugiat scelerisque varius morbi enim nunc. Sit amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Ac ut consequat semper viverra nam libero justo. Nulla facilisi cras fermentum odio eu feugiat pretium nibh. Dui id ornare arcu odio ut. Suspendisse in est ante in nibh mauris cursus mattis molestie. Sed odio morbi quis commodo odio. Sit amet nisl suscipit adipiscing bibendum est ultricies. Quisque sagittis purus sit amet volutpat consequat mauris. Dignissim diam quis enim lobortis scelerisque fermentum dui faucibus in. Massa tincidunt dui ut ornare. At varius vel pharetra vel turpis. Vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras tincidunt lobortis.[/div][/div]
  [div class=Image_3] [/div]
  [div class=Image_2] [/div]
  [div class=Image_1] [/div]
  [div class="Text_or_quote_here]"Eternity ends and begins with the ocean's tides"[/div]
  [div class=button_1] [/div]
  [div class=button_3] [/div]
  [div class=button_2] [/div]
 
aside from what Alteras Alteras mentioned with closing the div tags from class to div, there's also a missing class for "Image 2" and there were some places in the code where the tags still had "> in them and some spaces with . when the code was converted from css|html to bbcode, so i edited those sections and cleaned up the code a lil' bit as well ! i hope this helped ! spoilered below is the edited code!

Code:
[nobr]
	[class=background]
		position: relative;
		box-sizing: border-box;
		width: 240px;
		height: 320px;
		background-color:#E8E8E8;
		overflow: hidden;
		margin-right:auto;
		margin-left:auto;
		padding:0;
	[/class]
	[class=Text_Box]
		position: relative;
		overflow: auto;
		width: 110px;
		height: 237px;
		font size; 10px;
		padding: 10px;
		color:#E8E8E8;
	[/class]
	[class=Text_container]
		position: absolute;
		overflow: hidden;
		width: 110px;
		height: 237px;
		left: 114px;
		top: 24px;
		background-color:#6A8E8E;
		border: 4px solid #8BA0B3;
	[/class]
	[class=Image_3]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 24px;
		top: 42px;
		background:url(https://66.media.tumblr.com/85ca252a623eeb5c83d74f47575badb7/tumblr_pmrrgerICu1vxt811_540.jpg);
		background-position: center;
		background-size:75%;
		border:4px solid #8BA0B3;
	[/class]
	[class=Image_2]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 6px;
		top: 81px;
		background:url(https://66.media.tumblr.com/b32fd70bfd3d05cdef495d6562119cc3/tumblr_pmrrgeqrPK1vxt811_540.jpg);
		background-size: 100%;
		border:4px solid #8BA0B3;
	[/class]
	[class=Image_1]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 24px;
		top: 129px;
		background:url(https://66.media.tumblr.com/ca62ccf25595a503bf0e7bb30b8bfaaa/tumblr_pmrrgfdQQR1vxt811_540.jpg);
		background-size; 25%;
		border:4px solid #8BA0B3;
	[/class]
	[class=Text_or_quote_here]
		position: absolute;
		overflow:visible;
		left: 6px;
		top: 210px;
		width: 111px;
		height: 94px;
		text-align:center;
		font-weight: 200;
		font-size: 17px;
		color:#6A8E8E;
	[/class]
	[class=button_1]
		position: absolute;
		overflow: visible;
		width: 22px;
		height: 20px;
		left: 123px;
		top: 275px;
		background: url(https://imgur.com/2oN2mM2);
	[/class]
	[class=button_3]
		position: absolute;
		overflow: visible;
		width: 22px;
		height: 20px;
		left: 191px;
		top: 275px;
		background: url(https://imgur.com/2oN2mM2);
	[/class]
	[class=button_2]
		position: absolute;
		overflow: visible;
		width: 32px;
		height: 21px;
		left: 152px;
		top: 274px;
		background: url(https://imgur.com/RRxsOEE);
	[/class]
[div class=background]
  [div class=Text_Container][div class=Text_Box]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ac auctor augue mauris augue neque gravida in. Viverra nam libero justo laoreet sit amet cursus. Euismod elementum nisi quis eleifend quam adipiscing vitae. Facilisis gravida neque convallis a cras semper auctor. Dictumst quisque sagittis purus sit. Ut ornare lectus sit amet est placerat in egestas. Id semper risus in hendrerit gravida rutrum quisque non tellus. Vitae aliquet nec ullamcorper sit amet. Id semper risus in hendrerit gravida rutrum quisque non. Mi quis hendrerit dolor magna eget est. Facilisi morbi tempus iaculis urna id. Fames ac turpis egestas integer eget aliquet nibh. Tortor posuere ac ut consequat semper viverra nam libero.

Quisque sagittis purus sit amet volutpat consequat. Ipsum nunc aliquet bibendum enim facilisis gravida neque convallis a. Arcu dui vivamus arcu felis bibendum ut tristique et. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae. Et malesuada fames ac turpis egestas. Risus feugiat in ante metus dictum at tempor commodo. Mattis nunc sed blandit libero volutpat sed cras ornare arcu. Diam maecenas sed enim ut sem viverra. Elementum facilisis leo vel fringilla est ullamcorper eget nulla facilisi. Amet dictum sit amet justo donec enim diam vulputate ut.

Aliquam sem fringilla ut morbi tincidunt augue. Et molestie ac feugiat sed. Vitae turpis massa sed elementum tempus egestas sed sed risus. In metus vulputate eu scelerisque felis imperdiet proin fermentum. Enim blandit volutpat maecenas volutpat blandit. Ultricies lacus sed turpis tincidunt id aliquet risus. Feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Eget mi proin sed libero enim. In arcu cursus euismod quis viverra nibh cras pulvinar. Sed augue lacus viverra vitae congue eu consequat. Nascetur ridiculus mus mauris vitae ultricies leo integer malesuada nunc. Morbi tincidunt augue interdum velit euismod. Suspendisse sed nisi lacus sed viverra tellus in hac.

Cras adipiscing enim eu turpis egestas pretium aenean. Duis at tellus at urna condimentum mattis pellentesque id. Sodales ut etiam sit amet nisl purus. Vel turpis nunc eget lorem dolor sed. Sed vulputate mi sit amet mauris commodo quis imperdiet massa. Vel pretium lectus quam id leo. Diam quis enim lobortis scelerisque fermentum dui. Nec ultrices dui sapien eget mi proin sed libero enim. At auctor urna nunc id. Massa placerat duis ultricies lacus sed turpis. Augue ut lectus arcu bibendum at varius vel. Lectus magna fringilla urna porttitor rhoncus dolor. Neque gravida in fermentum et sollicitudin ac orci phasellus egestas. Viverra maecenas accumsan lacus vel facilisis volutpat. In massa tempor nec feugiat. Non blandit massa enim nec. A pellentesque sit amet porttitor eget dolor morbi. Non enim praesent elementum facilisis leo vel fringilla est ullamcorper.

Maecenas ultricies mi eget mauris pharetra. Sit amet risus nullam eget. Diam sollicitudin tempor id eu. At in tellus integer feugiat scelerisque varius morbi enim nunc. Sit amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Ac ut consequat semper viverra nam libero justo. Nulla facilisi cras fermentum odio eu feugiat pretium nibh. Dui id ornare arcu odio ut. Suspendisse in est ante in nibh mauris cursus mattis molestie. Sed odio morbi quis commodo odio. Sit amet nisl suscipit adipiscing bibendum est ultricies. Quisque sagittis purus sit amet volutpat consequat mauris. Dignissim diam quis enim lobortis scelerisque fermentum dui faucibus in. Massa tincidunt dui ut ornare. At varius vel pharetra vel turpis. Vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras tincidunt lobortis.[/div][/div]
  [div class=Image_3] [/div]
  [div class=Image_2] [/div]
  [div class=Image_1] [/div]
  [div class=Text_or_quote_here]"Eternity ends and begins with the ocean's tides"[/div]
  [div class=button_1] [/div]
  [div class=button_3] [/div]
  [div class=button_2] [/div]
 
aside from what Alteras Alteras mentioned with closing the div tags from class to div, there's also a missing class for "Image 2" and there were some places in the code where the tags still had "> in them and some spaces with . when the code was converted from css|html to bbcode, so i edited those sections and cleaned up the code a lil' bit as well ! i hope this helped ! spoilered below is the edited code!

Code:
[nobr]
	[class=background]
		position: relative;
		box-sizing: border-box;
		width: 240px;
		height: 320px;
		background-color:#E8E8E8;
		overflow: hidden;
		margin-right:auto;
		margin-left:auto;
		padding:0;
	[/class]
	[class=Text_Box]
		position: relative;
		overflow: auto;
		width: 110px;
		height: 237px;
		font size; 10px;
		padding: 10px;
		color:#E8E8E8;
	[/class]
	[class=Text_container]
		position: absolute;
		overflow: hidden;
		width: 110px;
		height: 237px;
		left: 114px;
		top: 24px;
		background-color:#6A8E8E;
		border: 4px solid #8BA0B3;
	[/class]
	[class=Image_3]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 24px;
		top: 42px;
		background:url(https://66.media.tumblr.com/85ca252a623eeb5c83d74f47575badb7/tumblr_pmrrgerICu1vxt811_540.jpg);
		background-position: center;
		background-size:75%;
		border:4px solid #8BA0B3;
	[/class]
	[class=Image_2]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 6px;
		top: 81px;
		background:url(https://66.media.tumblr.com/b32fd70bfd3d05cdef495d6562119cc3/tumblr_pmrrgeqrPK1vxt811_540.jpg);
		background-size: 100%;
		border:4px solid #8BA0B3;
	[/class]
	[class=Image_1]
		position: absolute;
		overflow: visible;
		width: 69px;
		height: 69px;
		left: 24px;
		top: 129px;
		background:url(https://66.media.tumblr.com/ca62ccf25595a503bf0e7bb30b8bfaaa/tumblr_pmrrgfdQQR1vxt811_540.jpg);
		background-size; 25%;
		border:4px solid #8BA0B3;
	[/class]
	[class=Text_or_quote_here]
		position: absolute;
		overflow:visible;
		left: 6px;
		top: 210px;
		width: 111px;
		height: 94px;
		text-align:center;
		font-weight: 200;
		font-size: 17px;
		color:#6A8E8E;
	[/class]
	[class=button_1]
		position: absolute;
		overflow: visible;
		width: 22px;
		height: 20px;
		left: 123px;
		top: 275px;
		background: url(https://imgur.com/2oN2mM2);
	[/class]
	[class=button_3]
		position: absolute;
		overflow: visible;
		width: 22px;
		height: 20px;
		left: 191px;
		top: 275px;
		background: url(https://imgur.com/2oN2mM2);
	[/class]
	[class=button_2]
		position: absolute;
		overflow: visible;
		width: 32px;
		height: 21px;
		left: 152px;
		top: 274px;
		background: url(https://imgur.com/RRxsOEE);
	[/class]
[div class=background]
  [div class=Text_Container][div class=Text_Box]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ac auctor augue mauris augue neque gravida in. Viverra nam libero justo laoreet sit amet cursus. Euismod elementum nisi quis eleifend quam adipiscing vitae. Facilisis gravida neque convallis a cras semper auctor. Dictumst quisque sagittis purus sit. Ut ornare lectus sit amet est placerat in egestas. Id semper risus in hendrerit gravida rutrum quisque non tellus. Vitae aliquet nec ullamcorper sit amet. Id semper risus in hendrerit gravida rutrum quisque non. Mi quis hendrerit dolor magna eget est. Facilisi morbi tempus iaculis urna id. Fames ac turpis egestas integer eget aliquet nibh. Tortor posuere ac ut consequat semper viverra nam libero.

Quisque sagittis purus sit amet volutpat consequat. Ipsum nunc aliquet bibendum enim facilisis gravida neque convallis a. Arcu dui vivamus arcu felis bibendum ut tristique et. Vulputate sapien nec sagittis aliquam malesuada bibendum arcu vitae. Et malesuada fames ac turpis egestas. Risus feugiat in ante metus dictum at tempor commodo. Mattis nunc sed blandit libero volutpat sed cras ornare arcu. Diam maecenas sed enim ut sem viverra. Elementum facilisis leo vel fringilla est ullamcorper eget nulla facilisi. Amet dictum sit amet justo donec enim diam vulputate ut.

Aliquam sem fringilla ut morbi tincidunt augue. Et molestie ac feugiat sed. Vitae turpis massa sed elementum tempus egestas sed sed risus. In metus vulputate eu scelerisque felis imperdiet proin fermentum. Enim blandit volutpat maecenas volutpat blandit. Ultricies lacus sed turpis tincidunt id aliquet risus. Feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Eget mi proin sed libero enim. In arcu cursus euismod quis viverra nibh cras pulvinar. Sed augue lacus viverra vitae congue eu consequat. Nascetur ridiculus mus mauris vitae ultricies leo integer malesuada nunc. Morbi tincidunt augue interdum velit euismod. Suspendisse sed nisi lacus sed viverra tellus in hac.

Cras adipiscing enim eu turpis egestas pretium aenean. Duis at tellus at urna condimentum mattis pellentesque id. Sodales ut etiam sit amet nisl purus. Vel turpis nunc eget lorem dolor sed. Sed vulputate mi sit amet mauris commodo quis imperdiet massa. Vel pretium lectus quam id leo. Diam quis enim lobortis scelerisque fermentum dui. Nec ultrices dui sapien eget mi proin sed libero enim. At auctor urna nunc id. Massa placerat duis ultricies lacus sed turpis. Augue ut lectus arcu bibendum at varius vel. Lectus magna fringilla urna porttitor rhoncus dolor. Neque gravida in fermentum et sollicitudin ac orci phasellus egestas. Viverra maecenas accumsan lacus vel facilisis volutpat. In massa tempor nec feugiat. Non blandit massa enim nec. A pellentesque sit amet porttitor eget dolor morbi. Non enim praesent elementum facilisis leo vel fringilla est ullamcorper.

Maecenas ultricies mi eget mauris pharetra. Sit amet risus nullam eget. Diam sollicitudin tempor id eu. At in tellus integer feugiat scelerisque varius morbi enim nunc. Sit amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Ac ut consequat semper viverra nam libero justo. Nulla facilisi cras fermentum odio eu feugiat pretium nibh. Dui id ornare arcu odio ut. Suspendisse in est ante in nibh mauris cursus mattis molestie. Sed odio morbi quis commodo odio. Sit amet nisl suscipit adipiscing bibendum est ultricies. Quisque sagittis purus sit amet volutpat consequat mauris. Dignissim diam quis enim lobortis scelerisque fermentum dui faucibus in. Massa tincidunt dui ut ornare. At varius vel pharetra vel turpis. Vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras tincidunt lobortis.[/div][/div]
  [div class=Image_3] [/div]
  [div class=Image_2] [/div]
  [div class=Image_1] [/div]
  [div class=Text_or_quote_here]"Eternity ends and begins with the ocean's tides"[/div]
  [div class=button_1] [/div]
  [div class=button_3] [/div]
  [div class=button_2] [/div]
Thank you^^ I shall try it
I guess, I just wasn't careful and let things slip by lol
 

Users who are viewing this thread

Back
Top