Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

stoid

macrumors 601
Original poster
I'm designing a new layout for my website (first time I've touched the poor thing in months :eek: ) and I'm getting a phantom pixel wide space in the top navigation area. This problem does not occur in Safari, but does in Firefox on both Mac and PC, and IE on PC.

Check the link:
http://www.purentropy.com/index_new.html

Notice that the logo is shifted off a pixel. The problem seems to be somewhere around the first link for 'video'. Notice that when you roll-over the button, there is a white line next to the hi-light. I've tried messing around with the table, but I can't find the value that is throwing it off. Ideas?

Thanks guys.

Also, post if you have comments about the new design, a quick mock-up can be found: here
 

stoid

macrumors 601
Original poster
Yeah, sorry guys, apparently the guy I that was reselling (via mesopia) some webspace didn't renew and so it's all down for awhile. I'm probably going to just purchase my own unique account once I finish off another project I'm working on.

However, after massive tooling tonight, I found the problem. The layout was based on nested tables (IE HATES layers and it's hard to get them centered the way I want), and apparently a nested table must be at least one pixel shorter than the cell it is located in. In this example the table that housed the navigation graphics was inside a cell that had a width set to 750 px. Naturally then I set the table to be 750 px wide to fill the cell. Firefox/IE (though oddly not Safari) would only render properly when the table was 749 px wide.

Go figure! Well, you learn something new everyday.

Posted a screenie though as I am still interested in feedback on the design (as if you can make a call from a screenshot! :rolleyes: ) Still, any comments would be appreciated!
 

Attachments

  • site.jpg
    site.jpg
    66.8 KB · Views: 168

homerjward

macrumors 68030
May 11, 2004
2,745
0
fig tree
stoid said:
Yeah, sorry guys, apparently the guy I that was reselling (via mesopia) some webspace didn't renew and so it's all down for awhile. I'm probably going to just purchase my own unique account once I finish off another project I'm working on.

However, after massive tooling tonight, I found the problem. The layout was based on nested tables (IE HATES layers and it's hard to get them centered the way I want), and apparently a nested table must be at least one pixel shorter than the cell it is located in. In this example the table that housed the navigation graphics was inside a cell that had a width set to 750 px. Naturally then I set the table to be 750 px wide to fill the cell. Firefox/IE (though oddly not Safari) would only render properly when the table was 749 px wide.

Go figure! Well, you learn something new everyday.

Posted a screenie though as I am still interested in feedback on the design (as if you can make a call from a screenshot! :rolleyes: ) Still, any comments would be appreciated!
i really love the drop-shadows on the various boxes :D
 

lgoss007

macrumors newbie
Jun 17, 2005
13
0
Maybe if I saw the screenshot of the messed up page I could deduce what the problem was (your solution sounds correct though, small little tweaks are often needed for strange reasons). But why are you using tables instead of CSS? Though IE messes up CSS too, but I find CSS much easier to work with (unless you tried CSS and IE killed it, which is definately possible).

This is the reason I dislike Microsoft though. They always break standards (and make up their own) so that you have to keep using their software. I'm positive they do this deliberately to keep people tied to their platform. A developer nightmare though (I'm just gonna tell people to download Firefox if they're using Windows to view my site, :p ).
 

stoid

macrumors 601
Original poster
lgoss007 said:
Maybe if I saw the screenshot of the messed up page I could deduce what the problem was (your solution sounds correct though, small little tweaks are often needed for strange reasons). But why are you using tables instead of CSS? Though IE messes up CSS too, but I find CSS much easier to work with (unless you tried CSS and IE killed it, which is definately possible).

This is the reason I dislike Microsoft though. They always break standards (and make up their own) so that you have to keep using their software. I'm positive they do this deliberately to keep people tied to their platform. A developer nightmare though (I'm just gonna tell people to download Firefox if they're using Windows to view my site, :p ).

Yeah, this is my first attempt at a real website for myself. This past year at college my course work included a couple of web design/coding classes and I needed a guinea pig. As I learned more, I incorporated those ideas. The site was constantly being redesigned, and what you see is a fifth version. I started using tables, and shifted to CSS and PHP, but in the end those all just made it too complex and introduced crazy errors in IE, so while there are layers used in the site to determine z-index and such, the main layout tool is tables.
 

stoid

macrumors 601
Original poster
homerjward said:
i really love the drop-shadows on the various boxes :D

Thanks! the content area is one fat load of alpha channel PNGs so that I could change the layout of the boxes depending on the page. And it works great in every browser except of course IE! There's a workaround hack that I'm going to use now that I've got the errors worked out for real browsers.
 

lgoss007

macrumors newbie
Jun 17, 2005
13
0
Looks pretty good for a first attempt at a real website. Though you'll run into IE problems whether you use tables or CSS. I really think CSS is the way to go as changing the layout is simplified since you don't have to redo the html page, just the css style (like here zengarden).

Here are some other good sites for some cool CSS techniques:
http://css.maxdesign.com.au/listamatic/
http://www.alistapart.com/topics/css/

Anyways, keep up the good work it's looking nice. ;)
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.