BBCode Help

Status
Not open for further replies.
insouciant said:
@darkflames13 I just mean the gray background? The gray part around the circle and scroll bar? And thank you! Then, to clarify, after I add both of those properties, I just play around with margins and what not to make it look the way I want it to?
Click to expand...
are you referring to this image?

if so the border around the pic is necessary to create the border radius -- or are you talking about the grey background in general? o_o;;
if it's the latter, i believe it's just @darkflames13 's iwaku bg

I COULD BE TERRIBLY WRONG THO, ITS SO LATE
 
rissa said:
are you referring to this image?

if so the border around the pic is necessary to create the border radius -- or are you talking about the grey background in general? o_o;;
if it's the latter, i believe it's just @darkflames13 's iwaku bg

I COULD BE TERRIBLY WRONG THO, ITS SO LATE
Click to expand...

I think I'm just being paranoid. I have the dark theme (black background), so I'm just hoping I don't need to put a property along the lines of "color: gray, width: 100px, etc. etc." to make gray rectangle/background around the circle and scroll bar because it looks so pretty without a gray box or whatever it is in my thread. ;___;

upload_2017-5-2_2-51-8.png

You can see here I have black background, so I think you may be correct about it just being the background/gray theme/etc. (or at least I would hope so xP)
 
  • Like
Reactions: rissa
@insouciant , Yea. That's just my background. Sorry about that xD
No need to add any grey background and whatnot to your code to make it work.
And yea. You can play around with the margins etc. to make it look the way you want c:
 
  • Thank You
Reactions: junebug and rissa
GAIS I'm clawing my eyes out! So, I did your suggestion for the divs, but it's only working for wraiths and golems, but not the others? o___o I don't know what happened!

Post in question:
PROJECT - Ein Spiel Für Zwei

Code (for your convenience):

Code: 
[SIZE=3]NOTABLE RACES[/SIZE]
[SIZE=2] GOLEM[/SIZE]
[div=
   background-image: url(https://i.imgbox.com/qrcSqX22.jpg);
   background-repeat: no-repeat;
   display: inline-block;
   vertical-align:top;
   height: 200px;
   width: 200px;
   border: 1px solid #000;
   border-radius: 50%;][COLOR=transparent].[/COLOR][/div][div=background-color: #000000; display: inline-block; text-align: justify; border-top: 1px solid black; border-bottom: 1px solid black; padding: 5px; margin: 13px; overflow-y: scroll; width: 450px; height: 150px; margin-left:1px; margin-right:2px; opacity: 0.9; font-size: 11px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.
[/div]
[SIZE=2]WRAITH[/SIZE]
[div=
   background-image: url(https://i.imgbox.com/huEROC3g.jpg);
   background-repeat: no-repeat;
   display: inline-block;
   vertical-align:top;
   height: 200px;
   width: 200px;
   border: 1px solid #000;
   border-radius: 50%;][COLOR=transparent].[/COLOR][/div][div=background-color: #000000; display: inline-block; text-align: justify; border-top: 1px solid black; border-bottom: 1px solid black; padding: 5px; margin: 13px; overflow-y: scroll; width: 450px; height: 150px; margin-left:1px; margin-right:2px; opacity: 0.9; font-size: 11px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.
[/div]
[SIZE=2]BANSHEE[/SIZE]
[div=
   background-image: url(https://i.imgbox.com/7EzCkopo.jpg);
   background-repeat: no-repeat;
   display-inline: block;
   vertical-align: top;
   height: 200px;
   width: 200px;
   border: 1px solid #000;
   border-radius: 50%;][COLOR=transparent].[/COLOR][/div][div=background-color: #000000; display: inline-block; text-align: justify; border-top: 1px solid black; border-bottom: 1px solid black; padding: 5px; margin: 13px; overflow-y: scroll; width: 450px; height: 150px; margin-left:1px; margin-right:2px; opacity: 0.9; font-size: 11px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.
[/div]
[SIZE=2]KELPIE[/SIZE]
[div=
   background-image: url(https://i.imgbox.com/cLHQM8Gk.jpg);
   background-repeat: no-repeat;
   display-inline: block;
   vertical-align: top;
   height: 200px;
   width: 200px;
   border: 1px solid #000;
   border-radius: 50%;][COLOR=transparent].[/COLOR][/div][div=background-color: #000000; display: inline-block; text-align: justify; border-top: 1px solid black; border-bottom: 1px solid black; padding: 5px; margin: 13px; overflow-y: scroll; width: 450px; height: 150px; margin-left:1px; margin-right:2px; opacity: 0.9; font-size: 11px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.
[/div]
[SIZE=2]JOROGUMO[/SIZE]
[div=
   background-image: url(https://i.imgbox.com/SISJ7ZeG.jpg);
   background-repeat: no-repeat;
  display-inline: block;
  vertical-align: top;
   height: 200px;
   width: 200px;
   border: 1px solid #000;
   border-radius: 50%;][COLOR=transparent].[/COLOR][/div][div=background-color: #000000; display: inline-block; text-align: justify; border-top: 1px solid black; border-bottom: 1px solid black; padding: 5px; margin: 13px; overflow-y: scroll; width: 450px; height: 150px; margin-left:1px; margin-right:2px; opacity: 0.9; font-size: 11px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.
[/div]
[SIZE=2]LICH[/SIZE]
[div=
   background-image: url(https://i.imgbox.com/PGKzOdJG.jpg);
   background-repeat: no-repeat;
   display-inline: block;
   vertical-align: top;
   height: 200px;
   width: 200px;
   border: 1px solid #000;
   border-radius: 50%;][COLOR=transparent].[/COLOR][/div][div=background-color: #000000; display: inline-block; text-align: justify; border-top: 1px solid black; border-bottom: 1px solid black; padding: 5px; margin: 13px; overflow-y: scroll; width: 450px; height: 150px; margin-left:1px; margin-right:2px; opacity: 0.9; font-size: 11px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.
[/div]
[SIZE=2]REVENANT[/SIZE]
[div=
   background-image: url(https://i.imgbox.com/EPMGQZZb.jpg);
   background-repeat: no-repeat;
   display-inline: block;
   vertical-align: top;
   height: 200px;
   width: 200px;
   border: 1px solid #000;
   border-radius: 50%;][COLOR=transparent].[/COLOR][/div][div=background-color: #000000; display: inline-block; text-align: justify; border-top: 1px solid black; border-bottom: 1px solid black; padding: 5px; margin: 13px; overflow-y: scroll; width: 450px; height: 150px; margin-left:1px; margin-right:2px; opacity: 0.9; font-size: 11px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.
[/div]
 
@insouciant You accidentally used display-inline:block for the others instead of display:inline-block :)
 
  • Thank You
Reactions: rissa
This may just be a hack, but for the image, I added a float:left;
And for the text space, I increased the height by 10px to prevent the float element from affecting the species names.


[div=float:left;
background-image: url(https://i.imgbox.com/qrcSqX22.jpg);
background-repeat: no-repeat;
display: inline-block;
vertical-align:top;
height: 200px;
width: 200px;
border: 1px solid #000;
border-radius: 50%;].[/div][div=background-color: #000000; display: inline-block; text-align: justify; border-top: 1px solid black; border-bottom: 1px solid black; padding: 5px; margin: 13px; overflow-y: scroll; width: 450px; height: 160px; margin-left:1px; margin-right:2px; opacity: 0.9; font-size: 11px; ]

The colored and emphasized text is what I changed~


NOTABLE RACES
GOLEM
.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.

WRAITH
.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.

BANSHEE
.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.

KELPIE
.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.

JOROGUMO
.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.

LICH
.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.

REVENANT
.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla viverra leo leo, at placerat tellus fermentum tempor. Maecenas non nisi efficitur massa venenatis aliquam id ac purus. Pellentesque dui quam, vulputate sed viverra vitae, egestas at purus. Phasellus euismod purus vitae magna fringilla aliquet. Aliquam eu ligula odio. Aenean auctor, dui eu pharetra hendrerit, massa ipsum tristique nulla, at placerat massa elit vulputate nunc. Sed finibus tempus facilisis. Duis ac risus pellentesque, tempor ex vitae, hendrerit ex. Nunc sed tincidunt sem. Suspendisse in massa sit amet mauris fringilla euismod elementum a diam.

Nulla sollicitudin turpis id luctus laoreet. Pellentesque pretium, orci nec lacinia tempus, est sem venenatis felis, eu rutrum ex risus a risus. Mauris facilisis ultricies erat quis ullamcorper. Sed id commodo sapien. Duis imperdiet eget turpis ac gravida. Sed imperdiet nunc elit, eget ultricies dui vulputate at. Vestibulum vel interdum neque. Suspendisse bibendum ante ut erat molestie elementum.


Edit: Helpful if I don't miss the code edits. lol
 
  • Useful
Reactions: junebug and darkflames13
@darkflames13 Thank you for your continuous help. I went ahead and fixed that and everything's looking better now. =w=

@Navuso Thank you for the suggestion hon! I'll keep that in mind for next time. :D
 
  • Like
Reactions: darkflames13
mine's going to sound like a dumb question, buuuuuuuut what color is this? I need to know the name and the # code for it. Also can it be used as a color for borders?
 
Vio said:
mine's going to sound like a dumb question, buuuuuuuut what color is this? I need to know the name and the # code for it. Also can it be used as a color for borders?
Click to expand...
I can tell you the hex code is #003366, but I can't help you with the name or the border thing ^^'
 
  • Thank You
Reactions: Esmeray
Joan said:
I can tell you the hex code is #003366, but I can't help you with the name or the border thing ^^'
Click to expand...

The rest I can look up on the hex website rissa linked. THANK YOU!
 
  • Like
Reactions: Joan
I have suspicions that the Courier New BBCode is not functioning. While it is shown as Courier New on Editor, it is displayed as ordinary text on-screen.

This piece of text was formatted with Courier New.

Does it show as Courier New on your computer?
 
Crow said:
I have suspicions that the Courier New BBCode is not functioning. While it is shown as Courier New on Editor, it is displayed as ordinary text on-screen.

This piece of text was formatted with Courier New.

Does it show as Courier New on your computer?
Click to expand...
It's actually defaulting to TNR. The font issue is in the bugs thread, I do believe.
 
.
Halo
​


How do I get it to not cut off one side like that? I've tried making it wider, and smaller.
 
For circle divs you have to be exact. So let's start with the code from a few pages back and add in your image.


.


For some reason the image was acting a lil funny so I added in a background-size: 100% 100%; to the code which basically tells the div where to place the image. With circle divs, unless you're experimenting with new ideas, it's always recommended to have matching height and width codes. You also want the border-radius code to be 50%, otherwise you'll get an oval and not a circle!

Code: 
[div=
   background-image: url(https://s-media-cache-ak0.pinimg.com/originals/d8/e8/c5/d8e8c58160de6f206299b1e77a5c6c3c.jpg);
   background-size: 100% 100%; 
   background-repeat: no-repeat; 
   margin: auto auto; 
   height: 500px;
   width: 500px;
   border: 1px solid #000;
   border-radius: 50%;][color=transparent].[/color][/div]
 
Will that be big enough to make it a background though?

@rissa
 
Tribulation said:
Will that be big enough to make it a background though?

@rissa
Click to expand...
What exactly do you mean? As it stands currently, it technically is a background. Are you wanting the circle div to have text "on top" of it?
 
I was wanting to initially, but I think with the color scheme, it'd be a little hard to make out. Perhaps I should just keep with the text box beneath it.

That said, do I just take the coding for the box o' text and capsulate it with coding to move it to the center?
 
Not necessarily:










Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi molestie at massa vel porta. Ut lacinia tortor in libero euismod sagittis. Morbi mollis urna quis dolor pretium vehicula ac eu urna. Maecenas vel rutrum dui. Nulla ut orci lorem. Nunc commodo erat ut dui semper, quis bibendum sem posuere. Maecenas sed tortor justo. Pellentesque diam quam, eleifend sit amet augue et, ultricies efficitur risus. Nulla mollis tellus in mattis pellentesque. Integer quis hendrerit magna, congue pellentesque lorem. Maecenas et malesuada purus. Duis blandit non est nec vestibulum. Pellentesque fringilla velit vel orci iaculis dictum.

Mauris blandit a sem ut pharetra. Aenean tincidunt, ex non volutpat aliquet, metus est iaculis lectus, in consequat felis neque nec erat. Mauris a lorem rhoncus, auctor libero eget, elementum nunc. Suspendisse urna est, aliquam sed nunc sed, vestibulum ornare leo. Morbi et augue libero. Proin diam erat, eleifend non tempus non, euismod eu lectus. Vestibulum id ullamcorper sapien. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent at porta arcu. Aliquam commodo rutrum neque, ut tempus odio feugiat rutrum. Integer posuere ultricies augue a convallis. Maecenas placerat sollicitudin sapien quis dictum. Etiam finibus orci libero, nec semper lacus congue vel. Sed dignissim, lectus vel dictum finibus, erat purus cursus justo, nec convallis odio velit quis lorem. Fusce non urna id ipsum consectetur molestie. Donec placerat posuere faucibus.

Aliquam viverra justo non ante porttitor tempus. Proin id dignissim orci. Mauris condimentum volutpat dui. Cras in suscipit justo. Morbi vel velit nec neque vestibulum blandit ut eu ipsum. Morbi efficitur, elit nec feugiat tincidunt, ipsum eros vestibulum mauris, ac maximus diam arcu vel orci. Duis eleifend nisl quis magna pharetra pretium. Suspendisse potenti. Etiam tincidunt velit sit amet nisi gravida tempus. Donec pharetra tellus vestibulum ipsum consequat faucibus. Maecenas efficitur, diam at interdum mollis, quam mi pulvinar ligula, eu porttitor neque metus in eros. Morbi congue volutpat lectus.

Donec nibh lorem, luctus eget leo et, vulputate cursus justo. Mauris nisi nibh, pulvinar at viverra eu, interdum sed ligula. Morbi tincidunt nisl ac magna auctor vulputate. Aliquam erat volutpat. Integer pellentesque tortor et urna varius, eget congue ligula aliquet. Curabitur ac velit at ipsum bibendum consectetur a vel nunc. Nullam feugiat ut libero a dignissim. Vestibulum vehicula est quis enim gravida malesuada porttitor sed libero. Morbi euismod vulputate lacus quis tincidunt. Cras placerat ex a purus sagittis accumsan. Nunc tempor mi id feugiat porttitor. Phasellus aliquet mi aliquet augue elementum, vitae consequat nisi aliquet. Integer tincidunt risus a nisi vulputate, non tincidunt arcu tempus.

Sed imperdiet aliquam neque. Integer volutpat enim in magna faucibus porttitor. Mauris justo diam, suscipit a posuere eget, egestas bibendum tortor. Donec viverra massa at porta auctor. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla egestas ipsum diam, id aliquam ligula feugiat quis. Etiam tristique felis at risus molestie aliquet. Donec eget arcu vitae diam aliquam euismod.


[spoili]
Code: 
[div= 
   height: 600px; 
   width: 600px; 
   border: #fff; 
   border-radius: 50%; 
   background-image: url(https://s-media-cache-ak0.pinimg.com/originals/d8/e8/c5/d8e8c58160de6f206299b1e77a5c6c3c.jpg);
   background-repeat: no-repeat;
   background-size: 100% 100%; 
   margin: auto auto;]







[div= 
   width: 500px; 
   height: 280px; 
   margin: auto auto; 
   overflow-y: scroll; 
   border: 0px solid #000;][div=
   padding: 13px; 
   font-size: 0.7em;
   color: #fff;]
[shadow]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi molestie at massa vel porta. Ut lacinia tortor in libero euismod sagittis. Morbi mollis urna quis dolor pretium vehicula ac eu urna. Maecenas vel rutrum dui. Nulla ut orci lorem. Nunc commodo erat ut dui semper, quis bibendum sem posuere. Maecenas sed tortor justo. Pellentesque diam quam, eleifend sit amet augue et, ultricies efficitur risus. Nulla mollis tellus in mattis pellentesque. Integer quis hendrerit magna, congue pellentesque lorem. Maecenas et malesuada purus. Duis blandit non est nec vestibulum. Pellentesque fringilla velit vel orci iaculis dictum.

Mauris blandit a sem ut pharetra. Aenean tincidunt, ex non volutpat aliquet, metus est iaculis lectus, in consequat felis neque nec erat. Mauris a lorem rhoncus, auctor libero eget, elementum nunc. Suspendisse urna est, aliquam sed nunc sed, vestibulum ornare leo. Morbi et augue libero. Proin diam erat, eleifend non tempus non, euismod eu lectus. Vestibulum id ullamcorper sapien. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent at porta arcu. Aliquam commodo rutrum neque, ut tempus odio feugiat rutrum. Integer posuere ultricies augue a convallis. Maecenas placerat sollicitudin sapien quis dictum. Etiam finibus orci libero, nec semper lacus congue vel. Sed dignissim, lectus vel dictum finibus, erat purus cursus justo, nec convallis odio velit quis lorem. Fusce non urna id ipsum consectetur molestie. Donec placerat posuere faucibus.

Aliquam viverra justo non ante porttitor tempus. Proin id dignissim orci. Mauris condimentum volutpat dui. Cras in suscipit justo. Morbi vel velit nec neque vestibulum blandit ut eu ipsum. Morbi efficitur, elit nec feugiat tincidunt, ipsum eros vestibulum mauris, ac maximus diam arcu vel orci. Duis eleifend nisl quis magna pharetra pretium. Suspendisse potenti. Etiam tincidunt velit sit amet nisi gravida tempus. Donec pharetra tellus vestibulum ipsum consequat faucibus. Maecenas efficitur, diam at interdum mollis, quam mi pulvinar ligula, eu porttitor neque metus in eros. Morbi congue volutpat lectus.

Donec nibh lorem, luctus eget leo et, vulputate cursus justo. Mauris nisi nibh, pulvinar at viverra eu, interdum sed ligula. Morbi tincidunt nisl ac magna auctor vulputate. Aliquam erat volutpat. Integer pellentesque tortor et urna varius, eget congue ligula aliquet. Curabitur ac velit at ipsum bibendum consectetur a vel nunc. Nullam feugiat ut libero a dignissim. Vestibulum vehicula est quis enim gravida malesuada porttitor sed libero. Morbi euismod vulputate lacus quis tincidunt. Cras placerat ex a purus sagittis accumsan. Nunc tempor mi id feugiat porttitor. Phasellus aliquet mi aliquet augue elementum, vitae consequat nisi aliquet. Integer tincidunt risus a nisi vulputate, non tincidunt arcu tempus.

Sed imperdiet aliquam neque. Integer volutpat enim in magna faucibus porttitor. Mauris justo diam, suscipit a posuere eget, egestas bibendum tortor. Donec viverra massa at porta auctor. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla egestas ipsum diam, id aliquam ligula feugiat quis. Etiam tristique felis at risus molestie aliquet. Donec eget arcu vitae diam aliquam euismod.[/shadow][/div][/div][/div]
[/spoili]

But to center the div below the circle image, yes, you'd just add in a margin: auto auto; OR margin: 0 auto; to center it beneath the circle div.
 
  • Like
Reactions: darkflames13
What would be the best way to align two images together on one row?
I have tried imga left and right but on my code it just splits the bottom text between the two images and I don't want that. I would like it if the two black squares shown here, had empty space between the two images and to move the text that is squished down to a readable format below. May I please get some help?
 
Status
Not open for further replies.
Top Bottom
Back