Centering CSS/HTML text vertically -


i making webpage using css when encountered problem. menu bar doesn't center links vertically in bar. should simple, need help. sorry making long, didn't want leave out.

html:

<html> <head> <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"> <title>noobydev</title> <style> body {     background-color: ccffff;      text-align: center;  } div.background {     width: 90%;     height: 200px;     background color: #00ff66;     border: 2px solid black;     margin: 0 auto;     text-align: left;   } div.background h3 {     margin: 0px 40px; } div.logo {     width: 350px;     height: 75px;     background: url(logo.png);     margin: 30px 40px; } div.nav {     background-color: #00cc66;     border: 2px solid black;     width: 90%;     margin: 0 auto;     text-align: left;      height: 30px;     border-top: 0px solid black; } .menu {     margin: 5px 10px;     background: #00cc66;     color: black;     -webkit-transition: color; } .menu:hover {     color: red; } div.center {     width: 90%;     height: 700px;     background color: white;     border: 2px solid black;     border-top: 0px solid black;     margin: 0 auto;     text-align: left;    } div.column1 h1 {     margin: 30px 40px; } div.column1 p {     margin: 30px 40px; } div.column1 {     width: 70%;     height: 100%;     float: left;     display: block;     border-right: 2px solid black; } div.column2 {     width: 30%     height: 100%;     float: left;     display: block;     text-align: left; } div.column2 {     margin: 30px 40px;     display: block;     text-decoration: none;     font-size: 30px;     font-color: black; } div.legal {     width:90%;     height: 50px;     background color: white;     border: 2px solid black;     border-top: 0px solid black;     margin: 0 auto;     text-align: center; } </style> </head> <body> <div class="background"> <div class="logo"> </div> <h3>have failed today?</h3> </div> <div class="nav"> <a style=text-decoration="none" href="index.html" class="menu">home</a> <a style=text-decoration="none" href="html.html" class="menu">html</a> <a style=text-decoration="none" href="javascript.html" class="menu">javascript</a> <a style=text-decoration="none" href="css.html" class="menu">css</a> <a style=text-decoration="none" href="java.html" class="menu">java</a> <a style=text-decoration="none" href="news.html" class="menu">news</a> <a style=text-decoration="none" href="games.html" class="menu">games</a> <a style=text-decoration="none" href="other.html" class="menu">other</a>  </font> </div> <div class="center"> <div class="column1"> <h1>home</h1> <br> <p>welcome noobydev.com! site document of fails , successes worth sharing. feel free use them unless otherwise instructed so. check , admire awesomeness!</p> </div> <div class="column2"> <a href="news.html#viral_video">video?</a> </div> </div> <div class="legal"> <p>this site heavily protected gargantuan army of mutant cotton balls; recommend not stirring trouble up. know, site looks best in internet explorer.</p> </div> </body> </html>

just add line-height div.nav:

div.nav {     background-color: #00cc66;     border: 2px solid black;     width: 90%;     margin: 0 auto;     text-align: left;      height: 30px;     line-height: 30px; }

here's js bin test: http://jsbin.com/oliwit/1/


Comments

Post a Comment

Popular posts from this blog

python - How to create a legend for 3D bar in matplotlib? -

Image
given ax = plt.subplot() : ax.bar()[0] can passed plt.legend() . however, ax.bar3d() returns none . how create legend displayed bars? update: passing legend="stuff" ax.bar3d() , calling ax.legend() raises /usr/lib/python2.6/site-packages/matplotlib/axes.py:4368: userwarning: no labeled objects found. use label='...' kwarg on individual plots. warnings.warn("no labeled objects found. " you need use proxy artist legends not supported. this code: from mpl_toolkits.mplot3d import axes3d import matplotlib.pyplot plt import numpy np fig = plt.figure() ax = fig.add_subplot(111, projection='3d') x, y = np.random.rand(2, 100) * 4 hist, xedges, yedges = np.histogram2d(x, y, bins=4) elements = (len(xedges) - 1) * (len(yedges) - 1) xpos, ypos = np.meshgrid(xedges[:-1]+0.25, yedges[:-1]+0.25) xpos = xpos.flatten() ypos = ypos.flatten() zpos = np.zeros(elements) dx = 0.5 * np.ones_like(zpos) dy = dx.copy() dz = hist.flatten() ax...
Read more

php - Dynamic url re-writing using htaccess -

how can rewrite http://mydomain.com/test/master.php?catid=2&subcatid=8 http://mydomain.com/test/master.php/catname/subcat using .htaccess file. once rewritten, how can access these parameters in master.php? note: untested, let me know if doesn't work. rewriterule ^master.php/([a-za-z0-9_-]+)/([a-za-z0-9_-]+)$ /master.php?catid$1&subcatid=$2 [l]
Read more

java - Multi-Label Document Classification -

i have database in store data based upon following 3 fields: id, text, {labels}. note each text has been assigned more 1 label \ tag \ class. want build model (weka \ rapidminer \ mahout) able recommend \ classify bunch of labels \ tags \ classes given text. i have heard svm , naive bayes classifier, not sure whether support multi-label classification or not. guides me right direction more welcome! the basic multilabel classification method one-vs.-the-rest (ovr), called binary relevance (br). basic idea take off-the-shelf binary classifier, such naive bayes or svm, create k instances of solve k independent classification problems. in python-like pseudocode: for each class k: learner = svm(settings) # example labels = [class_of(x) == k x in samples] learner.learn(samples, labels) then @ prediction time, run each of binary classifiers on sample , collect labels predict positive. (both training , prediction can done in parallel, since problems assumed ...
Read more