2 Replies - 2627 Views - Last Post: 07 December 2012 - 05:02 AM

#1 SULLY77  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 44
  • Joined: 08-November 12

Trying to get a restaurant menu to work

Posted 25 November 2012 - 11:04 AM

designing a webpage to show a 3 col menu cant get the third col into the main content div when page displays

have tried margin float etc
html code
		<!DOCTYPE html>

		<head>
		<title>Welcome to Bank Cafe</title>
		<link type="text/css" rel="stylesheet" href="STYLES2.css" media="screen">
		</head>
		<body>
			 
			 
					<div id = "adheader">
					 <img src="F:\BANKCAFE\the-bank-cafe.jpg" width= "1350" height ="120"
							 alt="bank cafe">
					</div><!--end#adheader-->
				
					
					
				
			<div id ="navbar">
					<ul> 
						
							<li><a href="Home.html">Home</a></li>
							<li><a href="FindUs.html">Find Us</a></li>
							<li><a href="Menu.html">Menus</a></li>
							
							<li><a href="Contact.html">Contact</a></li>
					</ul>
			</div><!--end#sidebar-->	
<div id ="maincontent">
			<div id ="starters">
			
			<h1>Starters €6.00</h1>
		<dl>
		<dt>Chicken Tempura</dt>

		<dt>Think strips of chicken in a light tempura batter,</dt><dt> served with fresh horse radish,</dt><dt> soy sauce and chilli dip.</dt>
		</dl>
		<dl>
		<dt>Guacamole Nachos</dt>
		<dt>Corn nachos with guacamole and cream dip.</dt>
		</dl>
		<dl>
		<dt>Dynamite Nachos</dt>
		<dt>Corn nachos with hot chilli sauce, cream, and jalapeρo peppers.</dt><dt><strong> Only for experienced investors.</strong></dt>
		</dl>
		<dl>
		<dt>Hang Seng Soup</dt>
		<dt>A hot and sour Chinese soup with tofu, bamboo, & mushrooms</dt>
		</dl>
		<dl>	
		<dt>Soup of the Day</dt>
		<dt>Varies daily. Ask teller</dt>
		</dl>
		<dl>
		<dt>Summer Beet Salad (V)</dt>
		<dt>Red beet & carmelised apple tossed with rocket,</dt> <dt>virgin olive oil & lemon juice sprinkled with toasted almond & feta</dt>
		</dl>
		<dl>
		<dt>Deep Fried Calamari (EUR3 extra)</dt>
		<dt>With a herb crust, served with home made tarter sauce & a lemon wedge</dt>
		</dl>
		<dl>
		<dt>Pak Choi Salad (V)</dt>

		<dt>Warm salad of pak choi, oyster mushrooms & grilled aubergines</dt> <dt>with a peanut, lime & chilli dressing and crisped vermicelli €12.00</dt>
		</dl>
		<dl>
		<dt>Greenback</dt>

		<dt>Grilled Asparagus, ricotta, capers, lemon oil, grilled bread €8.00</dt>
		</dl>
		

			</div>	

						 
					<div id ="mains">
					
			<h1>Main courses</h1>
		<dl>
		<dt>Grilled Sirloin Stea</dt>

		<dt>Prime Irish sirloin steak (10oz) cooked to your liking and served with a black pepper sauce, </dt><dt> french fries and mixed salad. €19.00</dt>
		</dl>
		<dl>
		<dt>Banker Burger</dt>
		<dt>Irish beef burger. Served in a bap with french fries & salad.</dt><dt> (Cheese, onion, tomato & our special banker sauce.)€15.00</dt>
		</dl>
		<dl>
		<dt>Bundesbanker </dt>
		<dt>German sausage in hot dog bun,</dt><dt>served with relish and french fries</dt>
		</dl>
		<dl>
		<dt>Vegetarian Risotto(V)</dt>
		<dt>€17.00</dt>
		</dl>
		<dl>	
		<dt>Resorto Risotto</dt>
		<dt>Risotto tossed with marsala, seasonal vegetables,</dt><dt> wild mushrooms topped with rocket & parmesan €15.00</dt>
		</dl>
		<dl>
		<dt>Aubergine Delight (V) </dt>
		<dt>Gratin of spiced aubergine, crushed potato, </dt> <dt>spinach & fresh goat’s cheese with lemon cream and braised scorzoner €12.00</dt>
		</dl>
		<dl>
		<dt>Penny & Chorizo</dt>
	<dt>Penne pasta in a spicy tomato basil sauce</dt><dt> with bell peppers & spicy chorizo sausage €14.00</dt>
		
		</dl>
		<dl>
		<dt>Haddock</dt> 

	<dt>Naturally smoked haddock with</dt></dt> Sauteed potatoes, chorizo, broccoli and onion cream sauce €14.95</dt>

		</dl>
		<dl>
		<dt>Linguine (V)</dt>
	<dt>Linguine with black olive tapenade, spinach, fennel & anchovy crumb crust€14.00</dt>
	</dl>
	<dl>
	<dt>Hot Property (V) </dt>

	<dt>Vegetable hot pot with pinto beans,</dt><dt> Buttermilk stone bread and marinated cauliflower salad €14.50</dt>
	</dl>
	<dl>
	<dt>King Pie </dt>

	<dt>Cavatappi pasta with pan-fried king prawns,</dt> <dt>Marinated salmon, parmesan, chilli, peas, cream & white wine €16.95</dt>
	</dl>

	<dl>
	<dt>Dow Jones Locker EUR22</dt>

	<dt>Fish burger with tartar sauce</dt>
	</dl>
	<dl>
	<dt>Regulatory Shamb </dt>

	<dt>Steak sandwich on homemade focaccia with chunky chips and chimmichurri €12.95</dt>
	</dl>
			  </div>
	                  <div id= "dess">

	<h1>Desserts</h1>
	<dl>
	<dt>Tiramisumi EUR6</dt>

	<dt>Tiramisu with a hint of Old Baily's</dt>
	</dl>

	<dl>
	<dt>Chocolate Tort</dt>
	<dt>dark chocolate tart with caramel ice cream and whiskey sauce €6</dt>


	</dl>
	<dl>
	<dt>Property Meltdown €5</dt>
	<dt>melted vanilla pod ice cream poured over brutti ma buoni cookies,</dt> <dt>espresso, and a shot of frangelico</dt>
	</dl>
	<dl>
	<dt>Banana Republic €5</dt>

	<dt>Vanilla ice cream wedged between fresh banana and smothered in chocolate sauce, fresh cream and nuts.</dt>
	</dl>
	<dl>
	<dt>KNICKERBOCKER GLORY €5</dt>

	<dt>An American classic layers of vanilla ice cream,<dt><dt> fruit cocktail, raspberry sauce and cream</dt> <dt>served with a spoon long enough to let you get every last bit!</dt>
	<dl>
	<dt>Mirage Sundae. €5</dt>

	<dt>Vanilla ice cream, chocolate sauce, crushed meringue</dt><dt> and a generous dollop of delicious whipped cream make this a very delectable desert!</dt>
	</dl>
		                </div><!--end#dess-->	
</div><!--end#maincontent-->			 
				
				
			
		</body>
			
		</html>




CSS CODE
	#rest{
		  
		 font-family: Cambria,Geneva, sans-serif;
		 
		 text-align:right;
		 }
		 h1,h2{
		  font-family: Cambria,"Palatino Linotype","Book Antiqua", "URW Palladio L",
		  serif;
		  }
		  p{
		  font-size:22px;
		  }
		  
		

	#navbar{
			 font-weight:bold;
			 height: 1.8em;
			 background-color: #280000;
			 overflow: hidden;
	        }
	#maincontent{
				background-color:#e6d99c;
				width:100%;
	            }
	#booking      {
				background-color:cream;
				text-align:center;
				}
			   h1,h2{
		  font-family: Cambria,"Palatino Linotype","Book Antiqua", "URW Palladio L",
		  serif;
		  }
		  p,label{
		  font-size:22px;
		  }
	#footer p{
			 margin: 0;
			 padding: 0px 0;
			 background-color:#DDDDDD;
			 text-align:center;
			 font-size:18px;
	}

	#starters{
			font-family: Cambria,"Palatino Linotype","Book Antiqua", "URW Palladio L",
		  serif;		
			float:left;
			text-align:center;
			width:30%;
	}
	#mains{
			font-family: Cambria,"Palatino Linotype","Book Antiqua", "URW Palladio L",
		  serif;		
			margin:auto;
	        width:30%;		
			text-align:center;
	}
	#dess{ font-family: Cambria,"Palatino Linotype","Book Antiqua", "URW Palladio L",
		  serif;	
		
		float: right;
		text-align:center;
		width:30%;	
	}
	#footer p{
			 margin: 0;
			 padding: 10px 0;
			 background-color:#DDDDDD;
			 text-align:center;
			 font-size:18px;
	}


 #navbar ul{
             margin: 0;
			padding: 0;
			list-style-type: none;
			}
#navbar a{
         float:LEFT;
		 white-space: nowrap;
		 border-right: 1px #EBEBEB solid;
		 padding: 3px 15px 4px 15px;
		 color:white;
		 text-decoration:none;
		 }
#navbar a:hover{
           	background-color: #EBEBEB;	 
			 color: #336666;
			 border-right: 3px #999999 solid;
			 border-bottom: 3px #999999 solid;
			 padding-bottom: 3px;
			 }
#adheader{	background-color: #330000;
           text-align: center;
		   padding: 30px;
		   }


		
			 
	 


sorry should have said div id = dess is the one im having problem with
starters and main displaying within main content

Is This A Good Question/Topic? 0
  • +

Replies To: Trying to get a restaurant menu to work

#2 Hqtitan  Icon User is offline

  • D.I.C Head

Reputation: 11
  • View blog
  • Posts: 51
  • Joined: 28-August 10

Re: Trying to get a restaurant menu to work

Posted 25 November 2012 - 01:43 PM

I don't know why it does this, but I have noticed with column layouts that when trying to place divs next to each other, even when specifying their widths so they are collectively the same width as their container, the last one still renders as too wide and drops down below the rest. I'm not sure this is the best solution, but you might try reducing the width to 29% or 29.5% and see if that fixes it.
Was This Post Helpful? 0
  • +
  • -

#3 DaveBromley  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 6
  • Joined: 04-December 12

Re: Trying to get a restaurant menu to work

Posted 07 December 2012 - 05:02 AM

its because you have your margin on the main set to auto.

You need to remove this and then float the main to the left and the dessert to the left too then add a left margin of 5% to both mains and desserts and this should solve your problem

Dave
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1