Help Some Questions!

[AnimeGenork]

Hello! So I'm not a complete newbie to BBCode, but I've also never delved too deeply into, either! I relied on divs for hidden scrolling and changing image sizes, but without them, I'm seeing it's still possible!

So, on to my questions:

How does one do hidden scrolling without the div? (I have a feeling the word "padding" might be in there, but if I'm being honest, I have no idea what that does )

How do you manipulate the size of an image without a div?

I hope what I'm looking for makes sense, and while I would stare at others' codes to see if I can figure it out, that wouldn't exactly be learning, would it? So thanks to anyone who can help me!

 

[Uxie]

hey ! i can't call myself an expert on this, but from what i understand, css properties can be added to the [border] and [bg] tags!
like so:
[border=transparent; height:100px; width:100px;][/border]
they work basically the same way as divs, except with a pre-set padding:10px; on it, so to create all the things you listed, you would just use the same codes but replacing [div] with [border=transparent;] ! you can change the padding, as you can see below, and the box-sizing:border-box property still works as well :") you can also still use percentages, but as far as i can tell, height: 100%; doesn't work for me. not sure why, but you could just use px values !

for the hidden scroll:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget interdum nulla. Etiam erat risus, vulputate vel mollis sed, iaculis sit amet ipsum. Vestibulum id massa sit amet nisl maximus lobortis at non risus. Donec sed ante nunc. Vestibulum tempor purus a risus consequat, ac vestibulum sapien sollicitudin. Mauris auctor efficitur nibh vel rutrum. Quisque eget lectus auctor, mollis massa et, lacinia sem. Nam eu magna semper dui accumsan pulvinar sit amet id mi. Curabitur sed mattis ipsum, eu iaculis risus. Vivamus urna erat, finibus vel dui a, dignissim pharetra est. Maecenas elementum, felis sit amet venenatis blandit, urna felis pharetra massa, ut sollicitudin diam augue nec velit. Donec egestas ac leo in volutpat. Vestibulum at vulputate leo. Suspendisse vitae ex lorem.

Etiam congue lobortis libero vel finibus. Vivamus eu nulla nec lectus malesuada scelerisque vel at velit. Sed arcu orci, accumsan eget enim in, scelerisque tincidunt leo. Maecenas eget ex consequat, porta lacus ut, condimentum tortor. Sed fermentum consectetur ultricies. Suspendisse eu scelerisque massa. Fusce lobortis dignissim mattis. Ut accumsan sapien nisl, in pulvinar augue molestie sit amet. Praesent ac lorem at mauris aliquam efficitur nec ut lectus. Aenean aliquet, sem quis rhoncus luctus, purus arcu ultricies libero, ac aliquam purus mauris a lectus. Nulla nec molestie nunc, vel pellentesque nisl. In ac nunc posuere urna tincidunt volutpat blandit sit amet urna. Sed feugiat, ligula eu fringilla dictum, nunc lectus vulputate est, in pulvinar ante nisl at ipsum. Mauris a magna tempor, posuere justo ut, aliquet massa. Cras rhoncus turpis sit amet lectus maximus semper. Aenean diam sem, pellentesque sit amet mollis in, tincidunt vitae est.

[border=transparent; height:200px; width:200px; border:1px solid black; padding:8px; overflow:hidden;][border=transparent; height:200px; width:100%; overflow-y:scroll; padding:0px; padding-right:40px; text-align:justify;]text![/border][/border]

and for the image:

[border=transparent; height:100px; width:100px; background:url('https://66.media.tumblr.com/213bcffd96911bcbb57978b1534198b7/tumblr_pno1mdskrY1v1ofe3o6_250.png'); background-size:100%;][/border]

of course, for the image, you could also choose to use [heightrestrict], but that would size down the image entirely rather than cropping it the way divs do!

i hope this helps !

 

[AnimeGenork]

hey ! i can't call myself an expert on this, but from what i understand, css properties can be added to the [border] and [bg] tags!
like so:
[border=transparent; height:100px; width:100px;][/border]
they work basically the same way as divs, except with a pre-set padding:10px; on it, so to create all the things you listed, you would just use the same codes but replacing [div] with [border=transparent;] ! you can change the padding, as you can see below, and the box-sizing:border-box property still works as well :") you can also still use percentages, but as far as i can tell, height: 100%; doesn't work for me. not sure why, but you could just use px values !

for the hidden scroll:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eget interdum nulla. Etiam erat risus, vulputate vel mollis sed, iaculis sit amet ipsum. Vestibulum id massa sit amet nisl maximus lobortis at non risus. Donec sed ante nunc. Vestibulum tempor purus a risus consequat, ac vestibulum sapien sollicitudin. Mauris auctor efficitur nibh vel rutrum. Quisque eget lectus auctor, mollis massa et, lacinia sem. Nam eu magna semper dui accumsan pulvinar sit amet id mi. Curabitur sed mattis ipsum, eu iaculis risus. Vivamus urna erat, finibus vel dui a, dignissim pharetra est. Maecenas elementum, felis sit amet venenatis blandit, urna felis pharetra massa, ut sollicitudin diam augue nec velit. Donec egestas ac leo in volutpat. Vestibulum at vulputate leo. Suspendisse vitae ex lorem.

Etiam congue lobortis libero vel finibus. Vivamus eu nulla nec lectus malesuada scelerisque vel at velit. Sed arcu orci, accumsan eget enim in, scelerisque tincidunt leo. Maecenas eget ex consequat, porta lacus ut, condimentum tortor. Sed fermentum consectetur ultricies. Suspendisse eu scelerisque massa. Fusce lobortis dignissim mattis. Ut accumsan sapien nisl, in pulvinar augue molestie sit amet. Praesent ac lorem at mauris aliquam efficitur nec ut lectus. Aenean aliquet, sem quis rhoncus luctus, purus arcu ultricies libero, ac aliquam purus mauris a lectus. Nulla nec molestie nunc, vel pellentesque nisl. In ac nunc posuere urna tincidunt volutpat blandit sit amet urna. Sed feugiat, ligula eu fringilla dictum, nunc lectus vulputate est, in pulvinar ante nisl at ipsum. Mauris a magna tempor, posuere justo ut, aliquet massa. Cras rhoncus turpis sit amet lectus maximus semper. Aenean diam sem, pellentesque sit amet mollis in, tincidunt vitae est.

[border=transparent; height:200px; width:200px; border:1px solid black; padding:8px; overflow:hidden;][border=transparent; height:200px; width:100%; overflow-y:scroll; padding:0px; padding-right:40px; text-align:justify;]text![/border][/border]

and for the image:

[border=transparent; height:100px; width:100px; background:url('https://66.media.tumblr.com/213bcffd96911bcbb57978b1534198b7/tumblr_pno1mdskrY1v1ofe3o6_250.png'); background-size:100%;][/border]

of course, for the image, you could also choose to use [heightrestrict], but that would size down the image entirely rather than cropping it the way divs do!

i hope this helps !

It does, thank you! \O.O/
I know next to nothing about coding outside of the BBC world (I still need help operating basic laptop functions LOL), so thank you for explaining! :3