![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
marahmarie posting in ![[community profile]](https://www.dreamwidth.org/img/silk/identity/community.png){kind=small}
style_systemTitle says it all - well, almost.
I'm using a narrow-width layout made waaaay back in 2009 and I still love it - but I don't much love its narrow width. I'm looking to pay somebody via Paypal or other similar method somewhere in the area of $10 to open up their copy of Photoshop and make me bigger versions of the background images I use on my layout right now. I've tried to do this myself with Paint.NET but I suck I just can't figure it out- the images come out grainy, fuzzy and weird looking. I've also tried most CSS tricks known to man but nothing has worked right or looked right, at least not so far.
Someone in my Circle has suggested I try running the images through GIMP, and I probably will if no one bites, but I'd just rather have someone who knows Photoshop help me get this done the right way.
Dimensions and other details...
Guess I should have mentioned all this to start with, but anyhow, this is based on what I wrote to someone on fiverr just now (with additional edits for DW based on my conversation with ninetydegrees below) along with my request:
I want the post entry space to be about 650px wide (measuring from end to end and including the margins and padding it is currently set at about 552px wide), 140px wide for each gutter if possible, and 250px wide across the sidebar (same as it is now). To edit or remake the background image for the post space probably means resizing the sidebar, header and footer images, too (because the top of the sidebar image currently attaches to the bottom right of the header and to the footer). I'm asking that all of the images stay the same colors and look as they are now and that the total page width does not exceed what it's at now (so in other words, I don't want a scroll bar on the bottom of the page because now the images make the page too wide to display full screen). But I want to keep at least one full inch of gutter on either side of the post entry space and sidebar.
Hope that's not all too much to ask...Thanks in advance!
Re: The intermediate thing...(more info - and again)
Date: 2015-01-09 05:44 pm (UTC)It's so awesome that you're helping me to finally get this done right - thanks again. :)
Re: The intermediate thing...(more info - and again)
Date: 2015-01-09 05:53 pm (UTC)This is 580px wide. Let me know if you need it smaller or wider.
Re: The intermediate thing...(more info - and again)
Date: 2015-01-09 05:59 pm (UTC)Re: The intermediate thing...(more info - and again)
Date: 2015-01-09 06:10 pm (UTC)#content{float:left;width:67%;}). Changed that to 80% and voila! It's done! I'll upload the edited CSS as soon as I finish writing this so in a few minutes you can go see for yourself - I think it looks just mahvalous, really and truly. Thank you soooooooo much!!!Re: one more request (which maybe I'll have to top-level post, so no pressure)
Date: 2015-01-09 06:27 pm (UTC)I can tell you that the problem starts at "comment-thread comment-depth-even comment-depth-16" according to page source and that the thread is just one long back and forth between me and another user. What happens is indentation becomes so severe at depth-16 and below (the thread went on to 20 comments altogether) that each comment starts printing just one word per line and snaking down the far right side of the comment post space and the usericon and title and date get all squished together so you can't even make out what you're looking at.
So....I thought resetting the entire DW to a wider width like I just did would solve that problem but apparently not?
And I can't see what there is in my code that I should either change, delete or add on to fix this issue.
Help me please???
Re: one more request (which maybe I'll have to top-level post, so no pressure)
Date: 2015-01-09 06:31 pm (UTC)Re: one more request (which maybe I'll have to top-level post, so no pressure)
Date: 2015-01-09 06:33 pm (UTC)Re: one more request (comments visible now)
Date: 2015-01-09 06:45 pm (UTC)(21 comments; if you start from the bottom and scroll up you'll see the problem instantly)
Re: one more request (comments visible now)
Date: 2015-01-09 07:13 pm (UTC)Ok not sure what's going on as things aren't correctly aligned for me (Firefox 34; 1600px wide screen): separator and background aren't aligned, entry has a wide margin on the left, things overlap. Took a quick look at your CSS and shouldn't #wrap be at 900px (650+250)? That would at least leave more room for comments. If having things align doesn't help enough reducing the indentation might be a solution too.
Re: one more request (comments visible now)
Date: 2015-01-09 10:03 pm (UTC)Um, OK, I'm using native 1366 x 768 widescreen on Firefox 34.0.5 and not having any issues but the only thing I've changed so far is the width on #content (which, with it being set to a percentage, will probably behave fluidly without further adjustment - I didn't really think about that). I didn't check any other sizes besides native so I'll go ahead and fiddle with things and get back to you - thanks.
Re: one more request (you're right, something's not lining up)
Date: 2015-01-09 10:22 pm (UTC)Re: one more request (you're right, something's not lining up)
Date: 2015-01-09 10:26 pm (UTC)Re: one more request (you're right, something's not lining up)
Date: 2015-01-10 01:55 am (UTC)Re: one more request (you're right, something's not lining up)
Date: 2015-01-10 01:58 am (UTC)Re: one more request (you're right, something's not lining up)
Date: 2015-01-10 02:12 am (UTC)Do you want me to pick the width again (which I ask because I'm afraid I'm just going to mess it up, again)...?
Wait...check it now...is it better? It seems OK now...
Date: 2015-01-10 02:41 am (UTC)ETA: the images aren't moving for me anymore at any res from native on down so it's just the comment nesting still acting weird. It seems OK through about the same depth as before, but after that it squishes comments against the right-hand side again.
Looking at style system's layout while in 1024 x 768 res I see the same problem after a certain comment depth, not just with comment-squishing but with qrform placement, as well (also a huge issue on my DW) where the comments squish down to one word per line and appear all snaky-like and qrforms are breaking out of the content box altogether and displaying in the right-hand gutter (yeah, as Alis might say: wheee!!!).
So fwiw that issue might not be fixable without some backend changes via fu, et al - and I'm saying so not because I'm some sort of CSS wiz who is sure of that already but because I've gone through the HTML and CSS so many times on and off for years now trying to adjust it in ways that might undo some of the damage done (mostly via DW's inline CSS, which does not inherit from comment to comment re: left margin indentation) that anyone who can come up with a workable solution definitely gets a tip of my hat (now that I'm seeing it's not a native problem to my DW at all but is likely a problem across the entire site, yeah).
Thank you so much for your help; there's still a lot of realignment of almost everything to be done on my DW but outside of the comment indenting I'm pretty sure I've got it from here. You are the greatest. :)
Re: Wait...check it now...is it better? It seems OK now...
Date: 2015-01-10 11:45 am (UTC)Yeah the comments getting squished is a problem for all styles with wide side margins if you stick to your custom style instead of the site style. There's no solution really because when you run out of space you can't create some. The only alternative is to implement sidebars and yuck.
Re: Wait...check it now...is it better? It seems OK now...
Date: 2015-01-10 07:18 pm (UTC)I've been in and out of
.dwexpcommentbut all that did was take threads after a certain nesting level and flatten them out (removing all indentation) so while it might have worked on that one layout (though I'm not sure how or even if it really did) I was using at the time it isn't working on this one.So last night I looked at page source again and noticed DW indents exactly 25px for every comment (something I may have noticed in the past but since forgot). And that we use
.comment-depth-even, .comment-depth-odd, and.comment-threadas a qualifier on the first two.Well, a comment thread can never start with an even number because the first comment on the page (at least the way we do it now, since we're rather fond of ignoring the number 0 around here) will always be #1. So a comment thread will always have to start with an odd number, which helped me to come up with this:
.comment-depth-even{margin-left:-15px; /* comment thread can never start with even # */}.comment-thread .comment-depth-odd{margin-left:-15px}I haven't tested the code against any comment pages except the one I was having a problem with, but it's working quite well on that one. While it doesn't fix the issue, it does re-widen comment threads up to a deeper nesting level than 20 or so, so comments will still squish at some point after that.
You're absolutely right, though - any page design that constrains comments to a finite amount of space (and technically, any comment thread that goes on long enough even given no space constraints whatsoever) will run into this issue.
Thanks again for all your help! I can't test right now to see if the differences in background image sizes will be noticeable on larger screens but if I ever get my widescreen monitor out of storage and back in the house I'll hook it up to my laptop and let you know.