• 0

Menu design not appearing properly


Question

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
  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
  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

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

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
  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.
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • Ahah the option off will only resume for their database and their view only. Your pov will stay clean but theirs will be stored and summarized ahah Meta is creepy
    • No, this is what Powertoys Run is aiming to be but is still only about a quarter of the way there. Tho with Raycast having a thriving third-party extensions store, don't think Powertoys Run will ever be able to catch up.
    • If you look at all RAID implementations that exist, you're going to find exceptions. However, all the modern consumer varieties tend to have some things in common (by default). I'll stick to describing those. When you add a disk to a RAID array, metadata is stored at the end of the disk. It records the array the disk is part of, which other disks are in the array, etc. This is called the RAID superblock. If you create a RAID 1 array, your operating system will see them all as a single disk that is very slightly smaller than a single disk (due to the superblock). Everything you write to the RAID disk gets written identically to each of its member disks by the storage controller. Technically, disks are read/written in blocks (each block is multiple sectors in size), but this is all transparent to the user. Every file you create or change or delete is created/changed/deleted on every member disk simultaneously. This is true whether you have 2 disks in the array or more than 2.  If one disk completely fails, you can still operate just fine off the remaining disk(s) (but see the caution below). If you remove one disk and attach it to another PC, it should work fine. The partition information and everything is all at the front of the disk, just as expected. The superblock will just appear as some extra junk at the very end of the disk, outside any partition. In some scenarios, where it is recognized as a RAID member disk from another PC, there might be an extra step before it will let you use it, but it's all very doable. Caution:  Blocks are read from the disks in a staggered fashion. For example, with 2 disks, all the odd blocks are read from one disk and all the even blocks are read from the other. By working together like this, read speeds can be practically doubled. But this comes with a huge drawback. If a disk doesn't fail completely, but instead develops bad sectors, you may not realize it. The bad sectors may happen to be in blocks that are never read on that disk. In some cases, people have had bad sectors develop on one disk, then had the other disk fail, and only then realized that the remaining disk has bad sectors and corrupt data. Every backup method has its pros and cons. Never trust just RAID, or just an external HDD, or just the cloud. Use multiple methods to backup important data.
  • Recent Achievements

    • Conversation Starter
      Kavin25 earned a badge
      Conversation Starter
    • One Month Later
      Leonard grant earned a badge
      One Month Later
    • Week One Done
      pcdoctorsnet earned a badge
      Week One Done
    • Rising Star
      Phillip0web went up a rank
      Rising Star
    • One Month Later
      Epaminombas earned a badge
      One Month Later
  • Popular Contributors

    1. 1
      +primortal
      534
    2. 2
      ATLien_0
      205
    3. 3
      +FloatingFatMan
      170
    4. 4
      Michael Scrip
      151
    5. 5
      Som
      127
  • Tell a friend

    Love Neowin? Tell a friend!