Hi
I have been working with a menu using bgimage and overbgimage to change the menuitems when selectim them.
This works just fine, but I have two small problems.
1. How do you offset the vertical position of the text relative to the bgimage ?? I don't want the text to be vertically centered as it is now
2. How do I set a minimum with of my menuitems in a topmenu. I found a minwidth property for the menu, but it doesn't seem to do the trick.
Thanks in advance
Allan
Text offset
Shure, you can see an exaple here :Ruth wrote:Hi,
We need to see the page, please provide a url.
http://www.bredahl.org/menutest/
The menu is constructed completely from backgroundimages and seperatorimages, but the text has to be in textformat since the menuitems are dynamically constructed.
As you can see the intention was that the text should be in the white strip, but somehow it will always be i a ventically centerposition.
This must be possible to change or am I hoping to much?
The width problem occurs since each item has to be wide enough to be able to hold the bgimage without clipping it...
Thanks again
Allan
Ok, this is going to be a bit long.
The text can be moved using the valign= property, however you have the css choice of top, middle, bottom. It is already in the middle and bottom just puts in in the dark blue at the bottom. So, I figured out how to do what you want by making a change in the images.
Do you do images, if not I can post what I have, I made them from yours, if you do, it's not hard to fix.
1. MenuBgOff.gif
create a totally white image that is 68 by 106. Then paste the one you have onto it aligning the top of your existing image at the top of the new all white image. You then have to also change the white line you have in the image, the top blue part should only be 36 instead of 41 in height before you get to the top of the white line.
2. MenuBgOn.gif You'd do the same thing with that except the width is of course 110, so 110 by 106, again you have to widen the white in the center so the top blue part is again 36px.
3. MenuBgSep.gif the same thing, make it 106 high and the white gets wider, shortening the top part of it.
It has to be higher so that if someone changes their font size, which you can't prevent in any browser unless you use images instead of bgimages, it will cause the bgimage to begin to repeat, which I'm sure you don't want. That does make the menu higher but because the bottom of the images are now white, you can make that table cell below it pretty small and still have the same white 'space' between as you have it now.
I like that layout, love the overimage that's really neat. Having said that, if you want to make sure it doesn't get out of alignment you should really do it with images that have the text on them, that way the font is set.
Ruth
The text can be moved using the valign= property, however you have the css choice of top, middle, bottom. It is already in the middle and bottom just puts in in the dark blue at the bottom. So, I figured out how to do what you want by making a change in the images.
Do you do images, if not I can post what I have, I made them from yours, if you do, it's not hard to fix.
1. MenuBgOff.gif
create a totally white image that is 68 by 106. Then paste the one you have onto it aligning the top of your existing image at the top of the new all white image. You then have to also change the white line you have in the image, the top blue part should only be 36 instead of 41 in height before you get to the top of the white line.
2. MenuBgOn.gif You'd do the same thing with that except the width is of course 110, so 110 by 106, again you have to widen the white in the center so the top blue part is again 36px.
3. MenuBgSep.gif the same thing, make it 106 high and the white gets wider, shortening the top part of it.
It has to be higher so that if someone changes their font size, which you can't prevent in any browser unless you use images instead of bgimages, it will cause the bgimage to begin to repeat, which I'm sure you don't want. That does make the menu higher but because the bottom of the images are now white, you can make that table cell below it pretty small and still have the same white 'space' between as you have it now.
I like that layout, love the overimage that's really neat. Having said that, if you want to make sure it doesn't get out of alignment you should really do it with images that have the text on them, that way the font is set.
Ruth
