Why Is This Not Centered?, I want what is inside a Style defined box to be displayed in three col |
Why Is This Not Centered?, I want what is inside a Style defined box to be displayed in three col |
Thaum2u |
Nov 7 2020, 11:58 AM
Post
#1
|
Group: Members Posts: 1 Joined: 7-November 20 Member No.: 27,622 |
Below is my current code. As you can see, the text inside of the "borderBox" does get separated into columns, as I wanted it to, but the text on the right side does not go all the way to the right, and the middle is not in the middle. According to everything I've read, those two things should happen, but yet they do not.
The "div#columns { display: flex; justify-content:space-between; }" part is what is supposed to do this. Did I not implement it correctly? <!DOCTYPE html> <html> <head> <title>Test</title> </head> <STYLE> #borderBox { border: 4px double rgba(9,94,31,0.8); border-radius: 8px; width: 555px; background-color: rgba(0,0,0,.75); padding: 15px 15px 15px 15px; text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif; font-style: normal; font-size: 18px; color: #31f55b; color: rgba(49, 245, 91, 1); } div#columns { display: flex; justify-content:space-between; } </STYLE> <body BACKGROUND="" TEXT="yellow" BGCOLOR="#000000" LINK="white" ALINK="red" VLINK="yellow" style="background-attachment: fixed;"> <center><br> <div id="borderBox" class="w3-display-middle"> <div id="columns" class="w3-display-middle"> <div class="w3-display-left">Left Side</div> <div class="w3-display-middle">Middle</div> <div class="w3-display-right">Right Side</div><br> </div> </div> </center> </body> </html> |
Lo-Fi Version | Time is now: 3rd June 2024 - 03:49 PM |