I am editing the CSS stylesheet of my moveable type blog here:
http://www.jessicamartin.org/blog
The strangest thing just happened. I was editing my left nav tags (the calendar items specifically) and now when I resize my browser, the calendar month completely disappears. I kid you not. I know it has to do with my css code because that is the only thing I was adjusting when this began happening. I tried reverting back what it was before (by memory) but apparently I'm not getting it right, as my calendar is still dissapearing.
Would any CSS experts out there mind having a look at my page (and code) to help me determine what I've done here?
Here is the css page associated with my blog:
http://www.jessicamartin.org:16080/blog/styles-site.css
Thanks in advance!
-Jessica
Strange Stylesheet Behavior
Hi!
I'm guessing you're using IE as I've had similar problems.
Having a quick tweek with your code I removed the position: relative; from the .calander declaration and it removed the problem.
However this has caused the calander to move on resize so it's possible this is not the effect your after?
Strange Stylesheet Behavior
Actually, that is EXACTLY the effect I am going for. I removed the position: relative; and all looks great. Thanks so much!
Curious, how do you do to check sites: do you d/l the page in question as well as the stylesheet then check it that way?
Also, I want to improve my knowledge of CSS. Do you have recommendations (online or through books) that are good for beginners?
Thanks again!
-Jessica
Strange Stylesheet Behavior
Glad that did the trick.
In general I download the page and css, link 'em up and play with it to see what's going on. In this case however I had a fairly good idea that this would be the problem cause I spent an age scrattching my head and starring at my code trying to fix a similar problem a while ago.
There are some usefull things once in a while on www.alistapart.com
Of course here is a great place to pickup tips and ways to do things.
Other that that I just cruze around google when I want to do a specific thing till I find it or give up and go home/bed (depending on who the works for )
Strange Stylesheet Behavior
Nice. Thanks for the tips.
So on the PC at my work the CSS code works great and just as I would like it to, allowing all of my elements on the page to float and shift as the browser resizes.
Yet when I got home from work and I checked my page on my MAC, the calendar remains static on the page while the rest of the elements shift.
Grrrrr. I loathe cross-browser issues.
Any ideas how I can get it to work on both browsers?
~
Strange Stylesheet Behavior
I'm sure it is possible to get all components of this table layout floating on both platforms.
I have been pulling my hair out over this. Are there any CSS experts or beloved geeks who could take a look at my code and help me out?
http://www.jessicamartin.org/blog
Thanks for any help you can offer!
-Jessica
Strange Stylesheet Behavior
If you remove the class from the div holding the calendar then the calendar will center above the ARCHIVES in Firefox. Is this the effect you are looking for?
<div align="center" class="calendar">
becomes
<div align="center">
The calendar will remain correctly styled.
Strange Stylesheet Behavior
Thanks Stu. I tried that and it works great on my PC. Do you have a MAC you could check it on? If not, I can check it on my MAC when I get home from work today.
*crosses fingers*
I really hope this works cross-browser...
~
Strange Stylesheet Behavior
Unfortunately I do not have access to a MAC, but I can give you a screen shot
http://capture.danvine.com/results/25183.png
This was produced by ~
http://www.danvine.com/icapture/
It looks promising
Strange Stylesheet Behavior
Thanks very much for the screenshot, and the advice. It looks and works great on my MAC.
I just discovered the CSS validator
and it appears I have many invalid tags on my site. Do you use and or recommend a CSS validator? A lot of the messages are confusing and dont make much sense to me
Perhaps its because I am relatively new to CSS, but I want to figure it out so that my site is tight and well designed and well functioning.
~
Strange Stylesheet Behavior
Glad it's ok now.
As to your validation, most of the errors are due to you using xhtml 1.0 transitional.
This requires all tags to be closed, even tags like <br> should be <br />
All your meta tags should be closed in the same way.
<meta name="keywords" content="weblog, weblogs, Jessica Martin">
should be
<meta name="keywords" content="weblog, weblogs, Jessica Martin" />
The rest of the errors are due to the use of code which should be transferred to css.
For CSS validation I use w3c.org