scriptygoddess

Not sure this is the right category for this – as I STILL don't understand WHY. I should probably add a special category for my CSS issues and name it "Dazed and very very confused"

I wanted the background of the page one color – and I wanted the area behind a sidebar and a main content area a DIFFERENT color (same goes if you try to use images).

When I created the HTML and CSS for this – it worked fine in IE (believe it or not!) but didn't in Firefox. The color for the background would NOT go behind the inner divs.

After A LOT of playing around – I realized, while the two inner divs (the sidebar and bodytext divs) were floated left – the outer "main" div (where I had specified this DIFFERENT color) was not indicated with any kind of positioning. Simply by adding the float: left; to that "main" div – and then suddenly the background I wanted shows up.

Ok. Now, can someone explain to me WHY?!?!?!

Here's an example of what I'm talking about. The top section shows how it looked when I was pulling my hair out. The bottom shows how it looked after many hours of hair pulling. (View source to see the code – obviously)

Again – the page behaves in both cases as I would have expected, in IE. It was Firefox that was having the problem.

Ever since I've been buying my music from iTunes (and not Buymusic, because they suck) – I've been very happy. (I know in the past I had mentioned trying out Napster – but in the end, iTunes won out.)

In any case – if you haven't yet started using iTunes – this week is a good week to start. In honor of their Anniversary – they're giving out a new free song each day this week. And no "no-namers", either. Today's free download is a Foo Fighters song.

FYI – Another reason why I like iTunes – is the ability for garage bands to upload and sell their music. (I know someone who did this recently)

Another good bookmark found by Jennifer's ETC. blog here:

CSS Help Pile

Some great tutorials over at Lynda's at So Very Posh:
pMachine to MT import script
Combining multiple blogs on one index page

As well, Bryan from RevloltingDigits.com expanded on my php 404 handling script – including adding a traceroute. Here's where you can find his version

I'm not sure that "Lessons Learned" is the most appropriate category for this, as all I've really learned from this little exercise is that IE on the Mac SUCKS.

1) When testing changes to a stylesheet on the Mac – I can't just hit refresh and have it load in the new/revised stylesheet. I have to actually QUIT IE completely (not just close all browsers – actually QUIT the program) then open it again – and THEN it will load the new stylesheet

2) That little trick they talk about with doing CSS forms – making an outer "row" div – and then two inline "label" and "formw" spans inside. This will only work in Mac IE (and sit all on one line) if I add an extra unlabeled, unstyled div… so instead of this:

<div class="row">
<span class="label">First Name</span>
<span class="formw"><input type="text" name="First_Name"></span>
</div>

I have to do this:

<div class="row"><div>
<span class="label">First Name</span>
<span class="formw"><input type="text" name="First_Name"></span>
</div></div>

UPDATE: HERE IS A BETTER WAY!!! – I'll leave all the above up here too, if for no other reason than just because it's interesting that this works also – but ideally, less code is better. I previously left a comment in this post that I would try it – and I did – and this new link has a solution that's better than mine. 😀 (found via the CSS Help Pile.)

3) In addition to the above, if that last </span> and the two </div></div> are on the same line – it gets messed up again. So if that last line looks like this:

…etc. etc….</span></div></div>

it'll get messed up. So it has to look like this:

…etc. etc….</span>
</div></div>

4) I also ran into a really weird problem with links completely disappering (on Mac IE only) when you hovered over them. I'm not talking like you hover, it turns to white, then you hover off, and it comes back. I'm talking about you hover over it, and then it's gone… and the only way to make it reappear on the page was to refresh. I DID fix this – but I'm not sure how. I have a suspicion that it had to do with too many nested divs styled with IDs instead of CLASSes. But I'm not sure. All I know is that I changed many of the styles to use CLASSes and it went away.

Again – like I said – I think the only thing I'm sure of here is that Mac IE REALLY sucks. I've only been doing my layouts in CSS for a few weeks now – and already I see a trend. Every browser is happy – pages validate – but Mac IE kicks the bucket.

I recently published a new site (in ASP), and took down the old pages. Some of them had been updated (with new page names) – others were simply going away. Just as I had done with PHP – I wanted a simple 404 page (in ASP) that would email me when people tried to hit the old pages. That way I could decide if I wanted to set up a redirect for some pages – but in all cases, I didn't want to show a 404 – (I'd just send them back to the home page). I was only interested in htm, htmls, and asp type pages (not interested in missing .ico or gifs)… so here's the script I came up with for my custom 404 page:

(That long explanation was basically to give you the idea that there's probably better/other ways to do this – but I had a specific goal in mind. You're welcome to post alternate, more elaborate methods in the comments. Just thought I'd give you the background first. I should also note that I am NOT anything even CLOSE to an expert on ASP. I only need to use it occasionaly, and I fumble my way through it the best I can – usually, very ungracefully.)
Read the rest of this entry »

I've already seen this article, but needed it today when converting a table based form to a CSS based form – A List Apart: Practical CSS

Here's another link about styling web forms: Sitepoint – Style Web Forms Using CSS

I can't tell you how many times I've left a comment on a blog, and even though I had previewed it, noticed about ten spelling errors just as soon as I pressed the 'submit' button.

I decided to fix this problem, at least on my blog, by letting users modify their comments for a designated period of time. I decided to share the code in case anyone else wants to implement this. It works directly with the MySQL database, so obviously it requires a MySQL-powered Movable Type blog.
Read the rest of this entry »

I've been fiddling with a syntax coloring hack for PHP that makes use of PHP's highlight_string function. Coupled with an upload script, it can highlight a file and stick it in a div that you can paste into a page.

The clever part was figuring out how to make the resulting code valid, as well as getting rid of non-breaking spaces (which turn into nasty invisible script-breaking beasts when you copy and paste from the browser). Just to be clear, 99% of the cleverness on my part was obtained from reading through the PHP.net user comments and public CVS.

Anyhow, here it is:
http://www.metalgeek.com/archives/2004/03/30/000018.php. And there's a link to the source as well, which shows you what it does.

I'd be interested to know if anybody finds it useful, or has any helpful comments. It would also be pretty cool to turn it into an MT plugin, but I can't quite grasp the syntax yet.

I wrote this little snippet of code to display my average posts per day on my journal. Unfortunately that number turned out embarrassingly small (0.383) so I added functionality to display how many days between posts (a post every 2 days looks better). Just uncomment the echo you prefer.

Requires PHP and MySQL.
Read the rest of this entry »