BB Code Help request

Status
Not open for further replies.

Apollyon

Previously Kross
Original poster
FOLKLORE MEMBER
Invitation Status
Posting Speed
  1. Multiple posts per day
  2. 1-3 posts per day
  3. One post per day
  4. 1-3 posts per week
Online Availability
9 A.M to 12 P.M - 6 P.M to 1 A.M
Writing Levels
  1. Intermediate
  2. Adept
  3. Advanced
  4. Prestige
  5. Adaptable
Preferred Character Gender
  1. Male
  2. Primarily Prefer Male
Genres
Fantasy, Scifi, Modern, Magical, Horror, Romance,
Code:
[div= background-image: url(https://i.pinimg.com/564x/fc/ed/7f/fced7f92fedcfae8c887ef38d00ddf5a.jpg); background-size: overflow; width:600px; height: 800px; border: 10px; border-style: solid; border-color:#190729 ; background-repeat:no-repeat;][div=padding-top: 50px; padding-bottom: 70px; padding-left: 35px; padding-right: 35px;]
[div= background-color:#b09d9e; margin: auto; width: 600px; height: 956px; opacity: 0.9; background-overflow: overflow; overflow: scroll; border: 6px; border-style: double; border-color:Pink;]


[div=header; color: #300A30; text-align: center; font-size: 18px; font-family: 'Arizonia'; font-style: normal;] [glow=#FFB7C5]Tomoe Yuuta [/glow]

I can't seem to get this image to set properly. I've tried shrinking it (Cause the original was huge.), to the size of something more...manageable? That is to say, I made it to the same dimensions of an image I used previously with no problem. Still nada. I've also tried Bkgrnd overflow and contain measures.
 
Can I just say that there are a few things to fix with this template?
A bunch of missing closing tags for all the div elements, for one. And when that was fixed, the area the text goes went way past the bottom of the background, and just... I tweaked and altered those as well as the background issue, as you can see below. You can play around with it some more to see what works best for you, lol.

The top one uses background-size: 100%;
The bottom one uses background-size: cover;

Overflow is not an accepted command for this particular element.
You can do percentages, you can specify the actual width and height, you can set it to cover or contain.
There's a lot of variables that will work, but it's all about knowing the right terms and what you want to do ;)







Code:
[div=display:inline-block;][div= background-image: url(https://i.pinimg.com/564x/fc/ed/7f/fced7f92fedcfae8c887ef38d00ddf5a.jpg); background-size: 100%; width:600px; height: 800px; border: 10px; border-style: solid; border-color:#190729 ; background-repeat:no-repeat;][div=padding-top: 50px; padding-bottom: 70px; padding-left: 35px; padding-right: 35px;]
[div= background-color:#b09d9e; margin: auto; width: 600px; height: 700px; opacity: 0.9; background-overflow: overflow; overflow: scroll; border: 6px; border-style: double; border-color:Pink;]



[div=header; color: #300A30; text-align: center; font-size: 18px; font-family: 'Arizonia'; font-style: normal;] [glow=#FFB7C5]Tomoe Yuuta [/glow][/div][/div][/div][/div][/div]


[glow=#FFB7C5]Tomoe Yuuta [/glow]






Code:
[div=display:inline-block;][div= background-image: url(https://i.pinimg.com/564x/fc/ed/7f/fced7f92fedcfae8c887ef38d00ddf5a.jpg); background-size: cover; width:600px; height: 800px; border: 10px; border-style: solid; border-color:#190729 ; background-repeat:no-repeat;][div=padding-top: 50px; padding-bottom: 70px; padding-left: 35px; padding-right: 35px;]
[div= background-color:#b09d9e; margin: auto; width: 600px; height: 700px; opacity: 0.9; background-overflow: overflow; overflow: scroll; border: 6px; border-style: double; border-color:Pink;]


[div=header; color: #300A30; text-align: center; font-size: 18px; font-family: 'Arizonia'; font-style: normal;] [glow=#FFB7C5]Tomoe Yuuta [/glow][/div][/div][/div][/div][/div]


[glow=#FFB7C5]Tomoe Yuuta [/glow]
 
  • Bucket of Rainbows
Reactions: Pahn
I only knew 'contain' and 'overflow' variables. @.@

So, what else was wrong? I mean, it worked fine before--why'd that particular picture not want to work with it?
 
I only knew 'contain' and 'overflow' variables. @.@

So, what else was wrong? I mean, it worked fine before--why'd that particular picture not want to work with it?
Contain is used when an image is larger than the area and you want all of the image inside of it.

This means that, if the ratio is not the same as the holding element, it will have blank space.
If the image is not larger than the element, it does not re-size it.

And, like I said, it was missing a lot of the closing tags. The [/div].
 
@Navuso
?
Is there a way, that when you make the div to apply a media player can you add the Title and artist it longs too
 
@rissa Do you know about this one?
I don't mess with the media players, unfortunately, so I haven't tried to see what can and can't be done with the coding, lol.
 
I'm not allowed to ask Rissa...
 
Status
Not open for further replies.