TC question! Titling Sub-Sections?
Replies
Hello! With Vesnali I've once again dusted off Nyrene and am attempting to work on her profile. That said, as her treasure is my pride and joy massive, I am attempting to section it off into slightly more manageable chunks to mimic areas/services that her flower shop offers.
I've gotten as far as managing to space it out, but I was wondering if there is a way that I can add a title per sub-section? The ultimate goal is to then have little buttons that you can use to navigate to each section, but that's a story for the future.
Where "SHOP STOCK" is the overarching title of the entire TC section.
Code that I'm currently using (that gives me the spacing)
{
width: 572px;
padding: 3px;
border-radius: 5px;
box-sizing: border-box;
border-style: solid;
border-width: 1px;
margin-bottom: 15px;
}
.treasure_item_name { display: block; font-size: 11px }
.treasure_item { height: auto; width: 130px; box-sizing: border-box; margin: 5px; border-radius: 5px; overflow: hidden; }
.treasure_item img { padding: 2px 33px; background-color: }
.treasure_item_name { padding: 2px; border-radius: 5px; margin: 5px; margin-top: 3px; height: 40px }
/***** SPACING OUT THE TC TO MIMIC SHOP SECTIONS ***/ / SEEDS **/ , , , {margin-top:15px!important;}
/** PLANTERS AND RELATED **/ , , , {margin-top:35px!important;}
/** FRESH BLOOMS **/ , , , {margin-top:35px!important;}
/** SIMPLE ARRANGEMENTS **/ , , , {margin-top:35px!important;}
/** ELABORATE ARRANGEMENTS **/ , , , {margin-top:35px!important;}
/** MISCELLANEOUS **/ , , , {margin-top:35px!important;}
Any help would be appreciated! I realize this is kind of a niche request but I don't think I've seen anyone else ask this yet.
the easiest – albiet hacky – way i can think to do it would just be to make new divs for each heading and manually position them so they're in the right spot. so something like:
.section {
position: absolute; left: 0;
width: 572; height: 30px;
font-size: 20px; text-align: center;
z-index: 2;
}
{top: __px} {top: __px} {top: __px}
and fill in the blanks with the correct number so they show up where you want them. obviously you can change the font styling (family, size, color, shadow, etc.) and you can of course add as many as you want, i.e. s4, s5, etc.
then, outside of the style tags, add the new divs like so:
to link to the specific sections, you would create an anchor link with the following:
and you'd just replace "s1" with the number of whichever section you're linking to. let me know if that works or you need any further explanation.
Ah, that's what I was afraid of. I guess I'll just have to make a note to myself that the specs will need to be changed whenever I finalize the rest of the written content.
Thank you so much for your help and the anchor link as well. :)
hmmmm i think you could put them inside a containing div and place THAT div after your last container ("regulars") and change the positioning to relative so its position will shift down as your container divs expand and move down the page? maybe something like:
and as i mentioned, change the position on .section from absolute to relative, and remove the height value. that way, the position of each subheader can stay the same as long as each section of the tc stays the same size.
It was bunching all together but then I added another position: relative each of the s1, s2, etc. and I can finangle them into their designated little spaces. Now I won't have to touch them again until I inevitably mess up her TC by adding more items lol. Thanks so much for your help!
Thanks for the heads up! I was always under the impression that lorem ipsem was public domain, but I don't know if that's just because I see it used so widely.