First of all big shout to everyone who has been helping me along, @vincent , @sabanna , @Aaron , and of course, can’t forget @Waldo
I’m slowly learning this but I think I am getting the hang of it. What I do is try to deal in %'s as much as possible.
For this page, I have my center images and around it I want text blocks that will be triggers for manipulating the images.
My concern is that when the browser changes size, the text blocks will stay off the image, and rather get closer to the outside border of the page.
There are actually 3 images there I have layered that I will be manipulating/morphing with opacity and other things, they are literally stacked on top of each other.
I was doing this in theory by taking the txt divs and copying the image placement, then moving the divs by actual pixels (because my image is set width and height).
I think I’m doing it right but I really have no idea, any help or suggestions would be HUGELY appreciated. Maybe I’m just getting lucky and it will mess up in real practice.
I’m not concerned with mobile yet just desktop.
Thanks so much like always for helping this N00B along
It seems pretty solid to me, I can’t make it behave a way you don’t want it to behave.
However can you tell me why you’re using both positionning AND transforms to place the elements? I get that the vertical centering method is used but for the left and right element, it seems if I remove the lateral transform and adapt the positioning values, I get the same effect…
I’d say thoses rules: (my rules)
if the result is good and loads fast
if the layout works
if it’s maintainable (acessible value,s not a huge ton of interactions,
hidden structure etc…)
if it’s not a code nonsense
then it is good.
Is it NASA kind of good? Probably not, but as important your and your clients’ websites are, they’re disposable, they’re here for quite a short amount of time, and more important, they’re here for you to fix anytime, if you spot a mistake (it’s not like it’s a printed book or an engraved disc)
My thought process was because my image is 300px so I really did the transform first, knowing any value >150px would make it sure that the divs won’t ever overlap no matter what size the window is. But I guess you’re right I could just do it with %'s right.
And yea its pretty crude and I like the comic and I hope my site evolves and doesn’t stay the same for 10 years
