30th: pinned

[yanyan]

Inspired by Pinterest. For additional items, copy and paste the code from ITEM START to ITEM END.

UPDATE (09/24) No need to make a new row, period. This code doesn't make use of tables anymore.

I have the choice of being constantly active and happy or introspectively passive and sad. Or I can go mad by ricocheting in between.

Mayoi Hachikuji
Monogatari Series

I have the choice of being constantly active and happy or introspectively passive and sad. Or I can go mad by ricocheting in between.

Mayoi Hachikuji
Monogatari Series

I have the choice of being constantly active and happy or introspectively passive and sad. Or I can go mad by ricocheting in between.

Mayoi Hachikuji
Monogatari Series

I have the choice of being constantly active and happy or introspectively passive and sad. Or I can go mad by ricocheting in between.

Scheherazade
Magi: The Labyrinth of Magic

I have the choice of being constantly active and happy or introspectively passive and sad. Or I can go mad by ricocheting in between.

Misaki Yata
K

I have the choice of being constantly active and happy or introspectively passive and sad. Or I can go mad by ricocheting in between.

Mayoi Hachikuji
Monogatari Series

<raw-code><center> <div style="width: 788px;"> <!--ITEM START--> <div style="background: #fff; width: 250px; margin: 0px 10px 10px 0px; box-shadow: #999 1px 1px 2px; display: inline-block;"> <img src="IMAGE HERE (MUST BE AT LEAST 250px IN WIDTH)" style="width: 250px;"> <div style="font: 12px georgia, serif; color: #777; text-align: justify; padding: 6px 10px 10px 10px;">TEXT HERE</div> <div style="background: #f9f9f9; border-top: 1px solid #e9e9e9; font: 11px helvetica, sans-serif; color: #999; text-align: justify; padding: 10px;"> <img src="ICON URL HERE" style="width: 28px; margin-right: 8px; float: left;"> <a href="LINK" style="text-decoration: none;"><span style="font: bold 11px helvetica, sans-serif; color: #999;">NAME HERE</span></a> <br/>TEXT HERE </div> </div> <!--ITEM END--> </div> <br/><br/> <small>code by <user name=cawaii></small> </center></raw-code>

Comments

[ex_choir339]

i used it for a muselist ehe...

[yanyan]

Just letting you know I updated the code so it doesn't make use of tables anymore! Ugh what you did with it is still so cute.

[itinerating]

Is there any way to have the box grow down instead of up when you add in more text?

I like the idea of having identically-sized images all aligning neatly at the top. But when I add a disproportionate amount of text to one of the columns it spikes it up and off balance from its neighbors in an upwards direction.

[yanyan]

Shoot, I just saw this. Sorry! The code used to do that, but the boxes would overflow into the comments section. Add "float: left;" after "display: inline-block;", and to prevent overflow, put the entire code in a table.

[itinerating]

Hey, no worries at all! Thanks for the tip, I appreciate it.

[ex_longanimity327]

so i kind of turned it into a navigation post and. this happened. ;_;

[rollin]

saki... did you make sure all your brs were < br/ > and not < br >

[sympathy]

OH

[torsion]

hey yana it breaks my layout
hey yana two years after you made this post
save me yana

i really hated my old nav so you have to

[rollin]

BEA...

just remove this part!
<div style="width: 788px;">
since that's the tag messing it up

let me know if it works!

[torsion]

idk if i can trust you, i mean i put my faith in your code and look what happens...









nah it worked, thank you very much for your nice code and also for helping me codenpai.

[rollin]

sometimes i don't trust my codes either BUT awww yeahhh glad i could help