![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
promethia_tenk posting in ![[community profile]](https://www.dreamwidth.org/img/silk/identity/community.png){kind=small}
style_systemHello all,
I'm on a devious mission toconvert my friend to DW make my friend happier with her DW by helping make her layout closer to her LJ one (she uses Compact over there). I've made my own journal into a testing lab with Librarian's Dream as my base. This community's archives have been deeply helpful, but I'm running up against the limits of my hunt-and-fiddle knowledge of CSS and I still need to get my laundry done today.
Here is a screen grab of where I am now.
Is anyone able to help me with:
1) That sidebar: Ideally I'd like the banner to run completely across the top with everything else on the page underneath it. I've inserted the banner with this code:
#canvas {
background-image: url(https://s20.postimg.org/r3spht7y5/japanese_cliff_city_banner.png);
background-repeat: no-repeat;
background-position: top center;
padding-top: 350px;
margin-top: 10px;
}
And I've been trying to push the sidebar down to be level with the main column. So far I have found about 12 ways to push the modules themselves down, but the background box surrounding them remains stubbornly behind. I've got a backup plan in case it can't be done, but a banner that goes clear across the top would be preferred.
2) Borders on icons: My friend's journal has small borders around all the icons. I've done so with .userpic{border: 1px solid #000000;} but this layout seems to have a small white margin on the bottoms of the icons (I assume for spacing? Or something to do with the link?) that I can't work out how to remove from the outline.
3) Profile module userpic: I recognize there's some more complicated formatting going on with the profile module that I don't understand and am basically trashing. By default the userpic is 1/4 size. I've embiggened it with .module-userprofile .userpic img {height: 100px; width: 100px;} but as you can see the icon border remains at 1/4 height. It would also be nice to be able to center the icon, though not essential. Have tried a few things to do that with no effect.
Thank you in advance for any insight you're able to provide!
I'm on a devious mission to
Here is a screen grab of where I am now.
Is anyone able to help me with:
1) That sidebar: Ideally I'd like the banner to run completely across the top with everything else on the page underneath it. I've inserted the banner with this code:
#canvas {
background-image: url(https://s20.postimg.org/r3spht7y5/japanese_cliff_city_banner.png);
background-repeat: no-repeat;
background-position: top center;
padding-top: 350px;
margin-top: 10px;
}
And I've been trying to push the sidebar down to be level with the main column. So far I have found about 12 ways to push the modules themselves down, but the background box surrounding them remains stubbornly behind. I've got a backup plan in case it can't be done, but a banner that goes clear across the top would be preferred.
2) Borders on icons: My friend's journal has small borders around all the icons. I've done so with .userpic{border: 1px solid #000000;} but this layout seems to have a small white margin on the bottoms of the icons (I assume for spacing? Or something to do with the link?) that I can't work out how to remove from the outline.
3) Profile module userpic: I recognize there's some more complicated formatting going on with the profile module that I don't understand and am basically trashing. By default the userpic is 1/4 size. I've embiggened it with .module-userprofile .userpic img {height: 100px; width: 100px;} but as you can see the icon border remains at 1/4 height. It would also be nice to be able to center the icon, though not essential. Have tried a few things to do that with no effect.
Thank you in advance for any insight you're able to provide!
