Before I Can Redesign
Ben’s hot redesign has reminded me that I need to fix this unsolved problem before 1) releasing “what you see” as a K2 style (not a mod) and 2) designing my next (and final) K2 skin. After that, I think I will build something from scratch. I would be extremely grateful to anyone who can help with my CSS issue.
I really like this style you’ve put on K2. The side drop shadows are perfect.
As for your CSS issue, I’d have to play around with it to fix it. If you put the code back the way you had it so the text is at the top of the footer then I could use firebug to mess with it.
Thanks Ben. I tried to put things back using Text Editor and gFTP, but I’ve gone and corrupted some files (hence the default them and no footer). I will have to try to fix it later when logged in under Windows. Not sure what I did wrong…any ideas? Also, what HTML editor and FTP client do you use in Ubuntu?
I find that gedit meets most, if not all, of my needs. I use gFTP.
Make sure the CHMOD is set correctly on your theme files, I doubt that’s the issue here but you never know.
A lot of people like SciTE for their text editor.
scott,
didn’t really read too many of the posts in the forum, but the last result should work.
this line:
padding: 50px 0 0px !important;
is incomplete. there needs to be 4 values in order for it to work like this:
padding: top(px) right(px) bottom(px) left(px)!important;
you should also put another value of padding for IE6 (that’s the point of having !important – so IE6 doesn’t see it)
margins don’t work like you think they should in Firefox, so i think padding should be your answer
In the case of
padding: 50px 0 10px;
The values are such: 50px padding on top, 0px padding on the left and right, 10px padding on the bottom. Similarly, in this case:
padding: 50px 10px;
The values are such: 50px padding on top, 10px padding on the right, bottom and left.
Oh, and I have to point this out, dale, I’m not taking shots at you, just correcting minor errors
.
“that’s the point of having !important – so IE6 doesn’t see it”
There’s no way to make IE6 not see something. Remember that in CSS the last command the browser reads is the one it obeys. So, if you had this:
padding: 50px;
padding: 60px;
The browser would put a padding of 60px and ignore the first command. If, however, you put this:
padding: 50px !important;
padding: 60px;
The browser would obey the command with the !important by it regardless of what comes later.
Regarding IE6, all you can do is get IE6 to see something that the other browsers can’t.
Remember that if a browser encounters a command that it doesn’t understand then it ignores it all together. So this command:
xpadding: 50px; would be ignored completely by every browser because there is no command called “xpadding”.
However, to IE6 the commands “_padding” and “padding” look the same, it doesn’t see the “_”. So, if you had this:
padding: 50px;
_padding: 60px;
Then firefox (or any other browser besides ie6) would see the first command of “padding: 50px” and would ignore the second command of “_padding:60px” because the one with the “_” wouldn’t make sense because it’s not a valid command.
HOWEVER, IE6 would see BOTH of the commands and obey the last command it saw. Namely, “_padding: 60px;” and would ignore the first.
Thank you both for your help. Right now I have it working the way I want it in Firefox, but not in IE7 (not sure about IE6 as I left my laptop with IE6 on it at work). Which brings me to my next point: I am thinking of ditching K2 soon.
I downloaded the latest version of K2 from the SVN (rev. 323). It’s just getting too complicated and less flexible. For example, with the way I’m running the drop shadows I apparently need to set the body width at 779px instead of 780px for IE7. The way I did this before was with an alternate stylesheet.
I was adding this to the header.php file (it’s an edit to the core K2 files, but I was adding stuff in the header for Mint and Lightbox anyway…something people are used to doing).
I was handling the IE6 issues in the transform.css file using the star-hacks (* html { etc…).
However, with SVN_323 the call to the main stylesheet and the scheme stylesheet are not in the header.php file anymore, but rather they are in some special K2 thing-a-ma-jiggy file (/app/classes/k2.php).
The bottom line is that the K2 development is making it more difficult for me to code a custom scheme that looks good in Firefox and IE7…that is, w/o having to edit the K2 core files (something that is antithetical to the custom drop-in theme concept).
I think K2 is a terrific WordPress mod. And remember that technically speaking it’s not a theme, it’s a mod. It changes the way WordPress functions. But that’s neither here nor there.
I think K2 is great for beginners with WordPress. It gives them a lot of functionality out of the box and helps them implement cool features into their blogs without touching any code. That’s a really good thing.
However, I’ve moved away from it for the same reason you did. I started to want to have complete control over everything in my code. That’s why I switched to Sandbox. Cutline is another theme that’s very straightforward to modify. K2, while it accomplishes its goal very well, isn’t made with the intention to have the code messed with a lot.
Then again, that’s just my take on things
.
I would agree with your take. K2 is great, but isn’t necessarily ideal for folks who want full control. I’ll have to look into Sandbox.
I still think that (considering browser incompatabilities) moving the stylesheet code out of the header is a mistake (that is, if I’m understanding this change correctly…and there isn’t a way of still dealing with it in the header).
Arrrgghhh….been playing around with Sandbox…trying to skin it like my K2 theme (there’s a K2 skin for Sandbox that I’m starting with). I wish I knew why a 780px background image (5px of drop shadow on either side) worked perfectly in Firefox with a 770px container, but was shifted a pixel to the right in IE. 8|
That’s affectionately known as the “freakin’ 1px bug in IE”
.
LOL…that s/b in Wikipedia.
I suppose there’s more than one way to skin a cat, though…and it was easier to see the solution in Sandbox: If I set the wrapper div to be 10px wider (780px) and put the background there, rather than on the body (and try to line things up), then it displays correctly in FF and IE7. I just have to push the padding in on the left and right of the wrapper to compensate for the extra width. I can’t use a horizontally repeating image for the header and footer (have to create a 780px wide background for those), but I guess it’s a small price to pay for squashing the bug.
“s/b”? What’s that?
Oh, and after working with Sandbox I can’t live without a “wrapper” div. It’s priceless.
“should be”
I really like Sandbox so far. I might just work on it instead of fixing this theme in K2 (svn-323 also has support for multiple columns built-in…further complicating anything I do).
About the only thing that bothers me about Sandbox is kind of minor. It appears that you have to put your skin’s CSS and Screenshot in the wp-admin/themes/sandbox/skins folder. From an organizational standpoint it would seem more logical to me to have Sandbox read subfolders for skins (e.g., themes/sandbox/skins/k2, ..skins/cutline, etc.).
I suppose. I’m sure there has to be a good reason why it was coded that way. But who knows? Maybe you’re on to something. Seriously, I’d email the author and suggest it to him. No harm can come of it. If anything you’ll make a new friend
.
Good suggestion. I just sent him a note, so I’ll let you know what I find out.
scott (the sandbox author) is planning on dropping the skins concept altogether, since it works better to have skins as themes, and use
template: sandboxin the beginning of the CSS file, so i don’t know that it’s likely he’ll change how the skin panel recourses subdirectories. (andy wrote that part anyway, and he seems busy ATM)anyway, i posted in that thread, i don’t know if you saw it. you should be able to add padding to the contents of #footer (without padding #footer), by using
#footer * { padding-top: 50px; }(the star means “all elements inside of”@Ben & Adam: Here’s the reply from Scott…
@Adam: I tried your suggestion, but unfortunately each line in footer.php has it’s own paragraph tags. It applies 50px of padding to the top of each line, thus running the text off of the footer and extending the whole page an extra 100px. I could edit footer.php, but that gets me back to my original problem where I didn’t want to have to touch the core K2 files.
This is what I currently have in my skin’s CSS (the last line offsets the core style.css padding):
#footer {
background: url('footer.png') no-repeat;
height: 100px;
padding: 0px 0 !important;
}