January 13, 201115 yr please 1 st visit the link below My link look there is a gap in the right side of the navigation bar. but i am not understading why this gap? there is a background images which is repeated .and its shows perfectly in localhost but not in webhost. why?
January 13, 201115 yr Author no no, i am not talking about the above gap of the menu box,i mean the gap of the right side of the menu box. right side of the contact us button you will not see this now on the provided link.because i use a padding left 2 pixel. but it stiil remain if i remove the padding Edited January 13, 201115 yr by abeer
January 13, 201115 yr Your #mwrapper has width: 1089px; but your menu ul.dropdown style ul and li tags in default.css have no widths, so they are just using the width they need. The li tags have side padding and side borders and the widths are determined by the text inside. Some browsers have slightly different character spacing and IE7 shows the menu fitting the width exactly but other browsers show a small space at the right end. I think it's just a coincidence that your link texts make the menu use nearly all the width. If you added a few extra characters to one link, like a extra m or two in commmunity you might find that the menu width exceeds 1089px and the Contact Us tab drops down to the left below. If you want the menu to fit 1089px exactly you have to code each li tag with a different class with a different width to suit the text inside. Make sure that the total widths plus all the side paddings and side borders equals 1089px. It will be complicated to do because some of the top level li tags have a class .dir and some don't, so the side padding is different at the moment so you would have to be very careful to sort it all out. If you look very carefully you will see that the School, About Us and Events menu tabs have less right side padding than the others. I think someone has already been trying to edit the padding to make it all fit.
January 13, 201115 yr In Firefox you have a gap on both sides of the menu. To avoid such problems, as Wickham said use fixed width for the list items, and bottom and top padding for height. Also, put the whole menu list inside a div tag that has the exact dimensions you need and has the background color you need for the menu. Than just position and adjust your menu size to fit accordingly. And another thing, I know you are not asking for a review for the design, but, can you please tell me what is the point of the radioactive, acid clouds floating in the header around the debaters? Or the unreadable text in the footer? Hope you work on those issues as well, and all is good at the end...
January 14, 201115 yr Author In Firefox you have a gap on both sides of the menu. To avoid such problems, as Wickham said use fixed width for the list items, and bottom and top padding for height. Also, put the whole menu list inside a div tag that has the exact dimensions you need and has the background color you need for the menu. Than just position and adjust your menu size to fit accordingly. And another thing, I know you are not asking for a review for the design, but, can you please tell me what is the point of the radioactive, acid clouds floating in the header around the debaters? Or the unreadable text in the footer? Hope you work on those issues as well, and all is good at the end... i put all the menu list in seperate div tag. and chose white as a background color.but i dont know why the background is not showing. the background is showing to my locals host but not showning online browser the second image of my 1st post is local host, and the 1st image is for online my question is why its ok on localhost and why not in online? Edited January 14, 201115 yr by abeer
January 14, 201115 yr i put all the menu list in seperate div tag. and chose white as a background color.but i dont know why the background is not showing. the background is showing to my locals host but not showning online browser the second image of my 1st post is local host, and the 1st image is for online my question is why its ok on localhost and why not in online? The Contact Us tab has a right border which isn't white, so that accounts for 1px of different color at the right end. The rest of the green at the right end instead of white is because the menu isn't using the total width. Are you using the same browser for local and online?
January 14, 201115 yr Try googling "reset.css" ... it gets rid of the annoying defaults that sometimes cause gaps.
January 14, 201115 yr Author The Contact Us tab has a right border which isn't white, so that accounts for 1px of different color at the right end. The rest of the green at the right end instead of white is because the menu isn't using the total width. Are you using the same browser for local and online? yes same browser. ie 7
Create an account or sign in to comment