Erik Harris wrote: >Being a very amateur CSS/HTML guy, I tend to have issues any time I try a >new design, and this time is no exception. I've volunteered to put >together a website for our homeowner's association, and I'm running into an >issue with the design I've put together. > >First of all, the WIP page is here: http://www.eharrishome.com/vha/ >The CSS is at http://www.eharrishome.com/vha/VHA.css - it was heavily >modified from another page, so there are likely some extra lines in the CSS >file that aren't referenced at all in the HTML. I'll do cleanup when I'm >closer to done. > >I'm having one issue at the moment. I'm not sure how to make my menu items >on the left have a fixed width. I made the LI element a block element, and >set its width to 100% (I also tried explicitly setting it to the same width >as its container DIV), but it's still the width of the text plus the >specified padding (which I tried removing, or changing to "auto" to no >avail). How do I specify the width of my LI element? > > Hi Erik, All of us had to start fresh in css and html, and to meet all good and bad things you're meeting too! :-) I see indeed you gave the li's a display:block. But if you want the links in the navbar will be clickable along the full width of the li, then you have to give the display:block to the links: ul.navbar li a {...}. Then the <a>'s have the full width. After that, I think some fine tuning of the width of ul and li's is needed (omitting in the li style itself, I guess).
>On an unrelated note, is there a known issue with different browsers >rendering images differently? I actually just noticed this, and it's not a >CSS issue - why does IE7 render my horizontal striped background PNG darker >than Firefox? I switch between the two windows and see a distinct >difference in hue between the two, and it's most noticeable in the >background image (I haven't done a color-picker comparison of the two to >see if it's more subtly affecting the other images). > > Yes it's true, I noticed that too some time ago. First I didn't believe my eyes. Then I did some color-picker experiments. I made the png myself, so I could have the original aside in PaintShopPro. Took some screenshots of different browsers, pasted them in PSP, and compared with the original. Result: FF is showing exactly the original colors, IE not. The rendering of gif's and jpg's is the same in FF and IE (and the same as the originals). Only if it is a png, IE is rendering it with a color shift. I is not the hue, but the brightness. The difference is about 10 units on the scale of 0-255, which is about 4%! That is quite a visible difference, even if you aren't an eagle. ;-) See screenshot of your bg-image <http://home.tiscali.nl/developerscorner/css-discuss/images/ie-png-color-shift.gif>. It can be problematic, if a png background image has to fit (on it's borders) in a straight background color, indicated by the color number... (workaround: straight color also as png, 1x1px, and repeated as bg-img; sometimes an extra wrapper-div can be needed, if bg-color and bg-img are together in one element). In your case, you can easy save your sidebar background img as 256 or 16 color gif (it has only 39 colors, of which some are horizontally different, which is not needed). The VHA background image has 57 colors, can be made a gif too. :-) Succes and greetings, francky PS: Some more about image saving on: http://home.tiscali.nl/developerscorner/imaging/image-saving.htm ______________________________________________________________________ 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/
