Bill saw me pull out of the parking lot as my wheel shot away from my car and has been trying to find me since. He had my wheel safe and sound and amazingly undamaged. Thank you very much Bill. It’s great to know that there are people like your out there still.
There has been some talk about the appropriate use of floating elements through CSS on several sites online. I have been working on several sites recently in which I have successfully integrated them (floats) cleanly and on the way discovered several bug in the model. I have documented some of the display issues here as well as provided several pages with demonstration code.
For starters I observed that floated elements can appear on either side within a div regardless of it’s position within the code (with limitations: see below). This has long been a source of irritation for me when laying out designs with absolute or relative positioning.
The reason for this is a less than obvious, let me explain. If a section of the content that is not relative to the page’s purpose. Say for example a sidebar full of links. Needs to be on the left side of the page, then that would have to come first in the markup or it would not align correctly when the page was displayed. This was a very odd quirk in CSS. To explain this a little deeper.. It is important to get the content as close to the top of the page as possible because while search engines do scan the entire page they do seem to hold the top of the page with a little more importance than the rest of the page. This is one of the holistically important issues to consider when designing a web site. Additionally, when viewing (listening) to a page with a screen reader the viewer would need to get past all of the links before they can get to the meat of the page.
Here are several pages that I used to test the CSS floats. I used 3 columns because of the complexity of it, and the ability that testing the effect that the 3rd column would have on the floats. The basic theory of this can be applied to 2 column layouts with floats by making a few assumptions based on the outcomes of the given examples.
The limitation seems to be the “float_right-left-left” page. For some reason the CSS engines don’t seem to like this. It works fine for 2 column layouts (based on experience) but not for the 3 columns that I tested here. This is seemingly understandable and can be worked around by using an absolute attribute as shown in this example. This is not the best solution for this problem because everyone’s favorite browser does a mockery of this fix. Providing alternative fixes to this display issue would extend the scope of this article indefinitely.
One additional caveat that I did find was some hidden math. I documented this in the CSS, but I want to add a little explanation here also. math explained:
Also the “sub_col_2” cannot be >230px without causing display errors. this is because of the 2px for the container element.
The moral of this story is that floats can be used to a certain extent for positioning without any major display errors. However, there are other problems that are caused by using every method available to us. As I always maintain my continuing recommendation is use the best tool for the job. The beauty of separating CSS from XHTML structural markup is that it is amazingly easy to change the display consistently across all pages without touching the structural markup.
I had planned to post something different tonight but this was just a little too amusing to pass up. I just finished watching the Tour de France Stage 17. It was absolutely incredible! Lance won by over one whole minute on an average 11% grade climb up L’Alpe d’Huez from Bourg d’Oisans.
This is not news, just about everyone that will pick up the sports section tomorrow will know about this. What I found funny enough to post about was that while showing Lance riding up the mountain side they showed an arial shot. I could clearly read some of the painted words on the roadway, some of which were in English. The one that caught my eye was, “Lance, Rip Their Balls Off!”
Ever feel that you are running through some Escher drawing?
That is kind of what it felt like to me at the Clermont race the other weekend.
I did have a pretty good race though, at least according to the timing system. I was some-how kicked in the chest while starting the swim & I had barely trained for any of the events. I knew that this race was going to hurt… a lot. This was more or less a race to prove to myself that I could still do it (race), and to motivate me to train more.
The swim looked a little long, but that’s just all the better for me. I really can’t complain about that. As usual it was a beach start with about 20+ in my age group. I positioned myself towards the middle of the clustered group. I usually have a strong swim leg and I counted on that. I am not afraid to bump a little in the water, as long as no-one does anything foolish like grab my ankles or anything. Well things started off fine. The person in front of me stopped at some point, stood up, fixed his goggles, and started swimming again. At this point I had come across him. As he began swimming again I was in just the right place to get a nice swift kick to the chest. It was not his fault, just some bad luck. But… I finished the swim after recovering and a little struggling. Nice course, good planning, overall 9 out of 10!
The bike course was Hilly… very hilly… very very hilly. You get the point. I had done almost no hill training except for a few meager rides on the Gandy Friendship trail which has only one bridge type rise to allow tall boats to safely pass underneath it. There were more than a few times that I began to think about walking. I either need to get another gear or get better at hills before the next race.
A good deed: About half-way through the bike leg after coming out of a corner and heading directly up-hill I passed some young girl walking her bike and crying. I huffed at her, “are you alright?” She cried, “yes, but my bike wouldn’t pedal!” I immediately knew that I could fix it in either mere seconds or not at all. So, I crumbled to my good will and told here as nicely as I could manage to get over next to me and I would take a look. Several seconds later and two very greasy hands later we were both on our way. I powered (crawled) my way up the hill and away.
Painful is the word that best describes this leg. Again I had done NO running training on hills prior to the race. This really hurt. The run was not as steep as the bike, but it still hurt. I couldn’t feel my legs or face for the first mile or so, but I finished.
Overall I have to say that it was an excellent race. Well organized and a great course. My only complaint about the entire thing was that there was a mix up with my number initially. The bike number didn’t match the other numbers that I was given. My Chip was assigned number 332 and I had 332 for my run number, but the vinyl sticker for the bike was 331. Easily fixed though. I had to walk past the transition area (from body marking) to the registrations and packet pick-up tent to get a repaired number from the event staff then walk back past transition to the body marking area again. Ok, I guess that is two complaints. The workflow could be a little better organized, and a little closer attention could have been paid when assembling the packets as I was not the only one to have this problem with the bike (or run) number.
I visited a good friend of mine who’s baby is in All Children’s Hospital. I always seem to have very strange memories of that place. It always seems surreal in my memories. Almost as if there really is a bull somewhere in that toreador.
Friday I went for my usual bike ride over by Northshore Pool. I had a great ride of around 20 miles. I held a great pace (for me) of 19.7mph. I felt absolutely great. So great in fact that after my ride while I was warming down I was screwing around on the bike trying to do wheelies… Needless to say after several (fairly successful) attempts I crashed. I just pulled a little to hard and then put a little too much power into the pedals and I went over backwards.
I knew that eventually I would crash, but that is not what is really getting at me. After I got up and checked to make sure I was all in one piece without any unusual new bends in my arms or legs. I checked my bike and everything, even the Derailleur was intact. When I was packing all of my equipment back into my car I was, of corse, a little distracted. I neglected to pack my front wheel, which I must remove for the bike to fit into the car. I had made it about 3 minutes down the street when I realized the bike was there but the front wheel was missing. Two minutes later I was back in the parking lot. The 2 women that were packing their bikes into their cars when I left had gone, and so had my wheel.
I checked with the pool staff, they had not had anything turned in.
The irritating thing is that whoever would steal this probably has a bit of money. Last I checked Target’s bikes didn’t accept 650c wheels!
The other day I was browsing some of my favorite GUI websites when I came to Max Rudberg’s Max Themes. Max is an incredibly talented graphic artist that chooses to devote a large part of his free time to building themes for Mac OS X and giving them to the community for free. As you can see by the image here, Max’s site suffered from an overflow problem. Now Max is not to blame because he does graphics and does not claim to know CSS or XHTML. He had the site done for him by someone else.
Anyway… getting back to my point. I decided that I would do my good deed and e-mail Max with not only the problem, but the solution as well. It turned out that I didn’t have the entire picture since his site is constructed by several PHP includes. He attempted my fix and when it didn’t work he sent me the files and after about an hour of ferriting through the CSS I came to the point of the issue and sent Max the fixed files.
All better, and now I have a clear conscience that I have brought at least one good deed back around to someone else.
You must be logged in to post a comment.