![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
![[identity profile]](https://www.dreamwidth.org/img/silk/identity/openid.png){kind=small}
Here is the layout I would like to use for the index page for Bella and Chain. Nice and clean, right? To the left of the leftward bike chain will be the links to the chapters. To the right of the rightward chain will be a description of the project. Between, the current chapter.
As I understand things, to make the page readable by the most people possible, the three areas of the page should be set in percentages relative to the width of the browser area the reader is using. I almost understand how to do that using the css block things. I'm getting there.
But see what's happening at the top of the page? I want that wheel to overlap with the chain just like that. So far I think that the chain is a separate image from the wheel and title, so that the chain can repeat-y down the page. But I want the wheel to be in that position relative to the chain no matter what the width of the screen is. If I set the chain at 20% from the left, and I set the wheel at 5% from the left, and the screen gets wider, the wheel moves to the left relative to the chain: if the screen gets narrower, the wheel moves to the right relative to the chain. Can I anchor the wheel image to the chain instead of relating it to the box or the screen?
Alternately, if I set the side bits to absolute measures, and anchored the chains and the wheel to some number of pixels or ems from the left (and from the right for the rightward chain), would the center box with the current chapter still accomodate different sized browsers?
As I understand things, to make the page readable by the most people possible, the three areas of the page should be set in percentages relative to the width of the browser area the reader is using. I almost understand how to do that using the css block things. I'm getting there.
But see what's happening at the top of the page? I want that wheel to overlap with the chain just like that. So far I think that the chain is a separate image from the wheel and title, so that the chain can repeat-y down the page. But I want the wheel to be in that position relative to the chain no matter what the width of the screen is. If I set the chain at 20% from the left, and I set the wheel at 5% from the left, and the screen gets wider, the wheel moves to the left relative to the chain: if the screen gets narrower, the wheel moves to the right relative to the chain. Can I anchor the wheel image to the chain instead of relating it to the box or the screen?
Alternately, if I set the side bits to absolute measures, and anchored the chains and the wheel to some number of pixels or ems from the left (and from the right for the rightward chain), would the center box with the current chapter still accomodate different sized browsers?
Tags:
no subject
I have to finish Afterwar before this project goes live, but I can't help messing around with it, and when I do start it, I want to be way ahead of myself so I won't fall behind until later.