BBcode: Youtube player position help

Lanternroads

Edgeknight
Original poster
LURKER MEMBER
FOLKLORE MEMBER
Posting Speed
  1. 1-3 posts per day
  2. One post per day
  3. 1-3 posts per week
Writing Levels
  1. Elementary
  2. Intermediate
  3. Adept
  4. Advanced
  5. Adaptable
Preferred Character Gender
  1. Male
  2. Female
  3. No Preferences
Genres
Modern, Fantasy, Cyberpunk, Romance..
So, I've got the bbcode down for the video to work, but I can't get the damn thing to move for the life of me. I'd like the mini youtube box to be in the middle of my character page, underneath the character photo, and above the dialogue box. Any help would be much appreciated x_x I'll attach the preview of my CP, and then the specific code underneath it.














Code:
[div= background-image: url(https://i.imgur.com/qQI0n71.jpg); background-size: cover; margin: auto; width: 800px; height: 900px; border: 1px; border-style: solid; border-color: #008080; border-radius: 20px;] 

[div= background-image: url(https://i.imgur.com/WjBdN8D.jpg); background-size: 120%; contain; background-position: center; margin: auto; width: 250px; height: 400px; text-align: center; border-radius: 50px 25px; border: px; border-color: #008080; border-style: solid;] 
[/div] 

[CENTER][div=border-radius: 8px; width: 32px; height: 32px; box-shadow: 0 0 2px 1px #c0c0c0;][div=opacity: 0.2; width: 32px; height: 32px; overflow: hidden;][div=position: absolute; top: 7px;][MEDIA=youtube]rd_lYdnUAA4[/MEDIA][/div][/div][/div]
[div][/div][/CENTER]
[div]

[div= background-color: black; opacity: 0.9; margin: auto; width: 85%; height: 300px; overflow: auto; border: 1px; border-style: solid; border-radius: 20px; border-color: #008080;] 
[div= body; color: white; font-size: 16px; text-align: center; margin: auto; width: 90%;] 
 

[/div][/div][/div][/div]
 
I GOTCHU FAM.

Instead of using center tags, try using margin: auto; inside the first player div.

Code:
[div= background-image: url(https://i.imgur.com/qQI0n71.jpg); background-size: cover; margin: auto; width: 800px; height: 900px; border: 1px; border-style: solid; border-color: #008080; border-radius: 20px;] 

[div= background-image: url(https://i.imgur.com/WjBdN8D.jpg); background-size: 120%; contain; background-position: center; margin: auto; width: 250px; height: 400px; text-align: center; border-radius: 50px 25px; border: px; border-color: #008080; border-style: solid;] 
[/div] 

[div=border-radius: 8px; width: 32px; height: 32px; box-shadow: 0 0 2px 1px #c0c0c0; margin: auto;][div=opacity: 0.2; width: 32px; height: 32px; overflow: hidden;][div=position: absolute; top: 7px;][MEDIA=youtube]rd_lYdnUAA4[/MEDIA][/div][/div][/div]
[div][/div]
[div]

[div= background-color: black; opacity: 0.9; margin: auto; width: 85%; height: 300px; overflow: auto; border: 1px; border-style: solid; border-radius: 20px; border-color: #008080;] 
[div= body; color: white; font-size: 16px; text-align: center; margin: auto; width: 90%;] 
 

[/div][/div][/div][/div]
 
To move the media box add in a ‘float: right’ or ‘left’ at the start of the media code.

In the future please ask bbcode questions in this thread. It can be found in the Coding Lab forum.