Allison Kelly wrote: > http://www.skeetrbeatronline.com/testpage.html > > Does anyone have any suggestions of how to tackle this? I am a bit > confused as to what the "best practice" would be here and what I can > actually do with CSS, or if I will need to use some simple tables as > well.
No tables needed. I needed a case to test some image-replacement and hover effects on today, so I used yours. Maybe you can use parts of my test page for something. Layout styles are in the page head.. <http://www.gunlaug.no/tos/alien/ak/test_07_082205.html> > Major questions for me: > > Does CSS use slices the same way that tables do? Should I keep the > slices for the tables that I had in mind when I started or should I > take that green circle picture out and just reposition it after I > create a two-column with header layout? We rarely ever build up real-world CSS based pages with image slices, as such pages would break under the slightest stress. By stress I mean 'font resizing' and other normal browser options. Forget the old table methods, but use parts of the image where they will actually work under stress. Testing is important here. I used the header, footer and navigation parts of your image, for image-replacement. Thought it came out just fine - for a test case that is, even if I used coarse image-handling methods. (I rarely ever create layouts based directly on PhotoShop designs :-) ) The circle picture interferes with content (text) in the two columns, but other than that it's easiest to keep it separate and position it on top once the basic layout is in place. I floated it and pulled it in place with margins, but you can also use absolute positioning. > I'm imagining using the slices that I have created as the background > in a div tag and then superimposing text over those. Does that make > sense, and is that the best way to go about this? Using a part of the image as a repeated background down the page, works well. See the test page. > Now that I have decided to go with CSS, I am at a loss as to where I > should begin with the rollover menu buttons. I used a simple "replace and offset" variant in the test page. That's all buttons with two states in one image, manipulated through CSS. More states can of course be added. Another variant is CSS Sprites... <http://www.alistapart.com/articles/sprites/> Note: The meta elements in your page make the HTML validator complain. Good luck. regards Georg -- http://www.gunlaug.no ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
