html - Can't Centre Header Contents - Navigation and Logo into one line -


i'm having problem have logo , navigation links in <header> , when use css text-align:center; logo goes on 1 line in centre , navigation links go onto line directly beneath it.

ideally them on 1 line next each other.

in jsfiddle below have added float:left; onto .logo class have them on same line temporary fix.

my jsfiddle: https://jsfiddle.net/z4f21hx3/1/

any appreciated.

thanks,

mistunleashed

this fix until 605px , under.

css:

/* beauty queen 7 css */  /* css reset */  * {     margin:0;     padding:0; } /* css main */  html {     background-color:#fff; } header {     background-color:#fff;     width:100%; } nav {     text-align:center;     margin:0 auto;     display:block;     box-shadow:0 4px 2px -2px gray; } .logo {     display:inline-block;     //float:left;     height:120px;     vertical-align:bottom; } .logo img {     height:120px;     width: auto; }  nav ul {     list-style:none outside none;     margin:0;     padding:0;     display:inline-block; } nav ul li {     display:inline-block;     list-style:none outside none;     -moz-transition:all 300ms ease-in-out 0s;     -ms-transition:all 300ms ease-in-out 0s;     -o-transition:all 300ms ease-in-out 0s;     -webkit-transition: 300ms ease-in-out 0s;     transition:all 300ms ease-in-out 0s; } nav ul li {     color:#555;     display:block;     line-height:5em;     padding:3em 1em 0em 1em;     text-align:left;     font-family:tahoma, geneva, sans-serif;     font-size:15px;     text-decoration:none;     -moz-transition:color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;     -ms-transition:color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;     -o-transition:color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;     -webkit-transition:color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;     transition:color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s; } nav ul li:hover {     background-color: #f36;     color: #ffffff; }

demo: jsfiddle


Comments

Post a Comment

Popular posts from this blog

javascript - Using jquery append to add option values into a select element not working -

i'm looking dynamically populate select element names of items stored array. for reason it's not working , i'm not sure why. html: <div class="col-md-4 col-md-offset-4"> <select class="select1"> </select> , <select class="select2"> </select> </div> note i'm using bootstrap layout. here's jquery i'm using try , populate ".select1" jquery: select: function() { $.each(state.greens, function(index, value) { $(".select1").append("<option value =' " + index + " '>" + state.greens[index].name + "</option>"); }); } note function 'select' stored within object called 'display'. state.greens name of array i'm trying access. so @ end of html page call display.select(); call function. no error messages showing in console. also, saw question: appending
Read more

Android soft keyboard reverts to default keyboard on orientation change -

i'm building android soft keyboard , can't seem fix bug - have arabic , qwerty keyboard , when rotate device on qwerty keyboard (or arabic shift), it's if program has "restarted" , becomes arabic keyboard without shift. the onsaveinstancestate(bundle savedinstancestate) not work because application not extend activity inputmethodservice . i put following in android manifest android:configchanges="keyboard|keyboardhidden|orientation" android:windowsoftinputmode="stateunchanged|adjustresize"> i tried using @override public void onconfigurationchanged(configuration newconfig) { super.onconfigurationchanged(newconfig); log.i(mydebug, "config changed " + currentkeyboard.equals(qwerty)); } however, currentkeyboard.equals(qwerty)) results false , made sure true before orientation change. any appreciated. i think applications fault. if application restarting on orientation change
Read more

Rendering JButton to get the JCheckBox behavior in a JTable by using images does not update my table -

i rendering jbutton image on simulate jcheckbox behavior. why don't let jtable render jcheckbox? because need bigger checkboxes , there's no way can resize them (as far know). so, have own table cell renderer , editor. both renders jbutton , checkbox images on them. trying change image checked image unchecked image (or vice versa) , update cell value (boolean true or false). however, reason, getcelleditorvalue() not update table. so, release mouse, value goes original one. any appreciated! lot! public class tableexample extends jframe { jscrollpane pane; jpanel panel; jtable table; object[][] data; mytablemodel tm; renderer buttoncolumn; public tableexample(object[][] data) throws ioexception { string[] columns = {"column#1", "column#2", "column#3", "column#4", "column#5", "column#6"}; this.data = data; this.setpreferredsize(new dimension(700, 500));
Read more