Freier Platz

11/10/2012 01:11 roloremo#1
Guten Abend liebe Community,
ich habe habe folgendes, wahrscheinlich sehr ungewöhnliches Problem:

Ich schreibe aktuell eine WebApp für jemanden aus meinem Bekanntenkreis.
Da ich keine Dropdown Menüs benutzen möchte (eigene Präferenz von wegen "Simplicity" und weil ich keine Dropdown-Menüs mag) packe ich jedes Menü auf eine extra Seite.
Das Problem ist, dass ich in einem von vielen Menüs nur theoretisch zwei Buttons anbringen muss und die Seite viel zu groß dafür ist, die Buttons aber nicht in eine andere Kategorie passen.

Was also anfangen mit dem übrigen Platz? Da ist sind noch viel bis zum Footer. Oder einfach die Buttons groß und schön darstellen?

Über eure Anregungen würde ich mich sehr freuen!

Mfg
11/10/2012 11:56 NotEnoughForYou#2
hast du vlt. eine live preview oder ein Bild? Kann mir das gerade schlecht vorstellen.
11/10/2012 14:49 roloremo#3
HTML
HTML Code:
<!DOCTYPE html>
<html> 
<head>
	<title>German Bartending</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
	<meta name="language" content="deutsch, de">
	<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
	<link href="advices-menu.css" type="text/css" rel="stylesheet">
</head>
<body>

<div class="header">German Bartending</div>

<div class="menu">
	<div class="menu-button" id="recipes">Rezepte</div>
	<div class="menu-button" id="advices">Tipps und Tricks</div>
</div>

<div class="content">
	<div class="advices-categories" id="expensive-vs-cheap">Teuer vs Billig</div>
	<div class="advices-categories" id="create-own-creations">Kreation-Findung</div>
</div>

<div class="footer">
	<div class="shortcut" id="website"></div>
	<div class="shortcut" id="facebook"></div>
	<div class="shortcut" id="youtube"></div>
</div>

</body>
</html>
CSS
Code:
html, body {
	display: block;
	font-family: georgia, "times new roman", times, serif;
	color: rgb(51, 51, 51);
	margin: 0;
	padding: 0;
	border: 0;
	background-color: rgb(247, 246, 238);
}

h1{color: rgb(89, 37, 0);}

h2{
	font-style: italic;
	color: rgb(51, 51, 51);
}

.header {
/* position: fixed; */
	background-color: rgb(51, 51, 51);
	height: 50px;
	/* width: 360px; */
	width: 100%;
	margin: 0px;
	padding: 0px;
	position: top;
}
.headliner {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	vertical-align: middle;
}

.menu {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 44px;
}
.menu-button{
	height: 100%;
	/* width: 178px; */
	width: 50%;
	/* border-style:solid;
	border-width: 1px; */
	margin: 0;
	padding: 0;
	text-align: center;
	float: left;
	
}
#recipes{background-color: rgb(51, 181, 229);}
#advices{background-color: rgb(51, 181, 229);}

.content{
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
}
.advices-categories{
	/* height: 100%; */
	height: 100%;
	width: 50%;
	margin: 0;
	padding: 0;
	text-align: center;
	float: left;
}
#expensive-vs-cheap{background-color: rgb(255, 255, 255);}
#create-own-creations{background-color: rgb(255, 255, 255);}

.footer{
	display: none;
	background-color: rgb(51, 51, 51);
	height: 50px;
	margin-bottom: 0px;
	padding: 0px;
	
}
11/27/2012 23:28 UserIsGrateful#4
@roloremo


Bin auch der Meinung, bzw. wünsche ich mir wie NotEnoughForYou ein Bild dazu. Denn der Quellcode von HTML und CSS ist schön und gut, doch nicht ausreichend um Aussagen zum Design zu treffen ;) .

Falls du inzwischen eine Lösung gefunden hast, teile sie uns doch bitte mit - Danke!
Ansonsten bitte live preview (Demo) oder Bild.
11/27/2012 23:35 Steini00#5
[Only registered and activated users can see links. Click Here To Register...]

Deine Problembeschreibung ist wirklich sehr mager. Wo hast du denn zu viel Platz? Nach unten, rechts - links?
Ich habe ja keinen Plan, was du da für einen Inhalt hast. Aber schon mal an Infos, Top´s, Likes, Share, Comment, Newsletter, SinUp, Warenkorb, News etc gedacht?