• 0

Menu design not appearing properly

Asked by takuma2004,

 Share

Question

Community Regular

takuma2004

Posted
Posted (edited)

Hi everybody,

Basically I've recently developed a website but at the moment I'm having a problem with the layout. The problem is that the Menu that I designed in Adobe Photoshop and later sliced it into small pieces to be able to use in Dreamweaver is not appearing properly (there are some gaps). Could anyone please tell me how I can rectify this problem.

Please see the attachment.

Thanks

post-63469-1249511076_thumb.png

Edited by takuma2004
Link to comment
https://www.neowin.net/forum/topic/807230-menu-design-not-appearing-properly/
Share on other sites

10 answers to this question

Recommended Posts

  • 0
Community Regular

takuma2004

Posted
  • Author
Posted
  mikeaag said:
what exactly is the problem you are having?

the two images you included, as far as i can tell, are the same thing? what am i missing here?

do you have a link to the actual webpage?

hi mate, i've just highlighted the area where the problem lies. you should be able to see that there are some gaps appearing there. there shoudn't be any gap.

  • 0
Community Regular

takuma2004

Posted
  • Author
Posted
  mikeaag said:
im not amazing at client side coding, but i would guess its to do with margins or padding.

do you have any code we can look at?

it could well be a problem with margins or padding however the same menu is appearing fine on some other pages.

  • 0
Grand Master

+Majesticmerc MVC

Posted
  • MVC
Posted

Without seeing some HTML its a little hard to tell, but by the looks of it, it looks like an issue with margins. Try adding "margin:0;" to the menu elements styles to see if that eliminates the gap.

EDIT: Beat me to it. Do you have any <br /> tags floating around maybe? Maybe your CSS is clashing. Does your menu have an "id='xxx'" and does it clash with a #class in your CSS files?

  • 0
Community Regular

takuma2004

Posted
  • Author
Posted (edited)

here's the source code of another page with the same problem. it's just after the body tag within the banner div <div class="banner">.

see if you can spot anything mate. 

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">;html xmlns="http://www.w3.org/1999/xhtml">;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
&lt;title&gt;Admin Login&lt;/title&gt;
&lt;link href="css/style.css" rel="stylesheet" type="text/css" /&gt;
&lt;link rel="shortcut icon" href="favicon.ico" /&gt;
&lt;/head&gt;

&lt;body&gt;
&lt;div class="site-wrapper"&gt;&lt;div class="banner"&gt;&lt;img src="images/project_03.jpg" alt="" width="8" height="42" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/login.php"><img"images/project_04.jpg" alt="Admin Login" width="34" height="42" /&gt;&lt;/a&gt;&lt;img src="images/project_05.jpg" alt="" width="620" height="42" /&gt;&lt;img src="images/project_07.jpg" alt="" width="662" height="55" /&gt;&lt;img src="images/project_08.jpg" alt="" width="662" height="8" /&gt;&lt;img src="images/project_09.jpg" alt="" width="30" height="21" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/index.php"><img"images/project_10.jpg" alt="" width="41" height="21" /&gt;&lt;/a&gt;&lt;img src="images/project_11.jpg" alt="" width="20" height="21" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/services.php"><img"images/project_12.jpg" alt="" width="83" height="21" /&gt;&lt;/a&gt;&lt;img src="images/project_13.jpg" alt="" width="20" height="21" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/claim.php"><img"images/project_14.jpg" alt="" width="85" height="21" /&gt;&lt;/a&gt;&lt;img src="images/project_15.jpg" alt="" width="21" height="21" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/howmuch.php"><img"images/project_16.jpg" alt="" width="69" height="21" /&gt;&lt;/a&gt;&lt;img src="images/project_17.jpg" alt="" width="20" height="21" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/faqs.php"><img"images/project_18.jpg" alt="" width="33" height="21" /&gt;&lt;/a&gt;&lt;img src="images/project_19.jpg" alt="" width="20" height="21" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/custserv.php"><img"images/project_20.jpg" alt="" width="115" height="21" /&gt;&lt;/a&gt;&lt;img src="images/project_21.jpg" alt="" width="21" height="21" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/forum/"><img"images/project_22.jpg" alt="" width="42" height="21" /&gt;&lt;/a&gt;&lt;img src="images/project_23.jpg" alt="" width="42" height="21" /&gt;&lt;img src="images/project_24.jpg" alt="" width="662" height="25" /&gt;&lt;/div&gt;
  &lt;div class="main"&gt;
  &lt;form id="adminlogin" method="post" action="adminLoginAction.php">lt;strong&gt;Admin Login&lt;/strong&gt;&lt;br /&gt;&lt;br /&gt;&lt;table width="616" border="0"&gt;

	&lt;tr&gt;
	  &lt;td width="131"&gt;User Name&lt;/td&gt;
	  &lt;td width="163"&gt;&lt;input name="txtUser" type="text" class="loginUser" id="txtUser" /&gt;&lt;/td&gt;
	  &lt;td width="308"&gt;(e.g. as_leeds)&lt;/td&gt;
	&lt;/tr&gt;
	&lt;tr&gt;
	  &lt;td&gt;Password&lt;/td&gt;

	  &lt;td&gt;&lt;input name="txtPassword" type="password" class="loginPassword" id="txtPassword" /&gt;&lt;/td&gt;
	  &lt;td&gt;(e.g. abc12345)&lt;/td&gt;
	&lt;/tr&gt;
	&lt;tr&gt;
	  &lt;td&gt;&lt;input type="submit" name="Submit" id="Submit" value="Submit" /&gt;
		&lt;input type="reset" name="Reset" id="Reset" value="Reset" /&gt;&lt;/td&gt;
	  &lt;td&gt; &lt;/td&gt;
	  &lt;td&gt;&lt;a href="forgotPassword.php">Forgotword?&lt;/a&gt;&lt;/td&gt;

	&lt;/tr&gt;
  &lt;/table&gt;
&lt;/form&gt;
  &lt;/div&gt;
  &lt;div class="bottom"&gt;&lt;img src="images/project_28.jpg" alt="" width="662" height="15" /&gt;&lt;img src="images/project_29.jpg" alt="" width="662" height="21" /&gt;&lt;img src="images/project_30.jpg" alt="" width="314" height="96" /&gt;&lt;img src="images/project_31.jpg" alt="" width="27" height="96" /&gt;&lt;img src="images/project_32.jpg" alt="" width="321" height="96" /&gt;&lt;img src="images/project_33.jpg" alt="" width="11" height="16" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/about.php"><img"images/project_34.jpg" alt="" width="31" height="16" /&gt;&lt;/a&gt;&lt;img src="images/project_35.jpg" alt="" width="299" height="16" /&gt;&lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/contact.php"><img"images/project_36.jpg" alt="" width="37" height="16" /&gt;&lt;/a&gt;&lt;img src="images/project_37.jpg" alt="" width="284" height="16" /&gt;&lt;img src="images/project_38.jpg" alt="" width="662" height="10" /&gt;&lt;/div&gt;
  &lt;div class="footer"&gt;© 2009 Accident Specialists | Created by A Ali | &lt;a href="http://www.inn.leeds.ac.uk/~c4455689/project/sitemap.php">Sitelt;/a&gt; | &lt;a href="http://validator.w3.org/"><img"images/valid-xhtml10.png" alt="Valid XHTML 1.0 Strict" width="80" height="15" /&gt;&lt;/a&gt; | &lt;a href="http://jigsaw.w3.org/css-validator/"><img"images/valid-css.png" alt="Valid CSS" width="80" height="15" /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;

Edited by takuma2004
  • 0
Community Regular

takuma2004

Posted
  • Author
Posted (edited)
  mikeaag said:
can you post the css that goes with the banner div please :D

here's the css for banner div. there's nothing inside it. although i have tried it with margin: 0; but it didnt work. 

.banner {

}

as the banner div comes under site-wrapper div i thought i'll provide you the css for that as well

.site-wrapper {
	width: 662px; height: auto !important; margin-left: auto; margin-right: auto;
}

Edited by takuma2004
This topic is now closed to further replies.
 Share
Go to question listing

  • Recently Browsing   0 members

    • No registered users viewing this page.