html - Why is my horizontal menu not floating to the right? -


would know why horizontal menu floating right despite ? can view live here.

<header>    <nav>     <ul>       <li><a href="#">home</a></li>       <li><a href="#">work</a>         <ul>           <li><a href="#">résumé</a></li>           <li><a href="#">portfolio</a></li>         </ul>       </li>       <li><a href="#">play</a>         <ul>           <li><a href="#">experiments</a></li>           <li><a href="#">utilities</a></li>         </ul>       </li>       <li><a href="#">contact</a></li>     </ul>   </nav>   <div id="news_box" style="max-width: 400px; float: right; text-align: left;"></div>  </header>

css:

body {   background-color: rgb(255, 255, 255);   font-family: helvetica;   font-size: 16px;   font-weight: 400;   line-height: 1.38;   color: rgb(21, 84, 244);   margin: 0;   margin: 0;     padding: 0;     border: 0; }  header {   width: 100%;   height: 600px;   min-height: 300px;   margin-right: auto;   margin-left: auto;   background-image: url('http://lorempixel.com/output/nature-q-c-1020-711-1.jpg');   background-size: cover;   background-position: center center;   background-color: rgb(222, 222, 222); }  h1 {   width: 100%;   margin-top: 39px;   margin-right: auto;   margin-left: auto;   font-size: 37px;   font-weight: 400;   line-height: 1.38;   text-align: center;   color: rgb(0,0,0); }   .blablatext {   margin-top: 16px;   margin-right: auto;   margin-left: auto;   font-weight: 400;   line-height: 1.38;   text-align: center;   color: rgb(21, 84, 244); }  nav {margin: 20px auto} nav ul li {display: inline-block; margin-right: -4px; margin-left: 5px; vertical align: top} nav {padding: 7px 10px; text-decoration: none; color: rgba(255,255,255,0.9); background: rgba(0,0,0,0); border-radius: 5px; font-weight: 300; text-transform: uppercase; letter-spacing: 1.5px; font-size: 13px} nav a:hover {background: rgba(0,0,0,0.25)} .activenav {background: rgba(0,0,0,0.25)} nav ul li ul {position: absolute; display: block; margin-top: 5px; border-radius: 5px; border-top-left-radius: 0; background: none; padding-top: 5px} nav ul li ul li {display: block; float: none; margin: 0; padding: 0} nav ul li ul li {display: block; text-align: left; color: rgba(255,255,255,0.9); text-shadow: 0 1px rgba(0,0,0,0.33); padding: 10px} nav ul li ul li a:hover {background: rgba(20,150,220,0.5); color: white; text-shadow: 0 1px rgba(0,0,0,0.5)} .hover {display: block;} .hover span { color: rgba(255,255,255,0.9); background: rgba(20,150,220,0.5); border-radius: 5px; position: absolute; display: block; margin: 5px 0 0 -57px; padding: 10px; font-size: 13px; font-weight: 300; letter-spacing: 1.5px; text-transform: uppercase; text-align: center; cursor: default;}

this keep news div below , float right 

nav {     float: right;     margin: 20px auto;     width: 100%; } nav ul {     float: right; }

result result


Comments

Post a Comment

Popular posts from this blog

commonjs - How to write a typescript definition file for a node module that exports a function? -

consider, toml node module can use: // toml.d.ts declare module toml { export function parse(value:string):any; } declare module "toml" { export = toml; } then: /// <reference path="../../../../../defs/toml/toml.d.ts"/> import toml = require('toml'); toml.parse(...); however, node module export single function, such 'glob' ( https://github.com/isaacs/node-glob ). the node usage of module be: var glob = require("glob") glob("*.js", {}, callback(err, files) { ... }); you'd naively expect this: // glob.d.ts declare function globs(paths:string, options:any, callback:{(err:any, files:string[]):void; ...but because typescripts 'import' semantics bit strange, seems can use 'import .. = require()' statement alias modules . trying call: /// <reference path="../../../../../defs/glob/glob.d.ts"/> import blog = require('glob'); results in: error ts2072: mod...
Read more

openid - Okta: Failed to get authorization code through API call -

i'm integrating okta own idp server using okta's api. i'm implementing authorization code flow following steps below: in own server, use /api/v1/authn endpoint sessiontoken. use sessiontoken obtain authorization calling endpoint: /oauth2/v1/authorize?client_id=" + clientid + "&sessiontoken=" + sessiontoken + "&response_type=code&response_mode=query&scope=openid&redirect_uri=" + redirecturl + "&state=evanyang&nonce=" it's supposed return response status code 302 , location header containing redirect url code value. however, keep getting response status code 200 , without location header, html body saying "you using unsupported browser." , "javascript disabled on browser." according api documentation: http://developer.okta.com/docs/api/resources/oidc.html#authentication-request , sessiontoken parameter sufficient this: an okta one-time sessiontoken. allows api-based ...
Read more

ios - Change Storyboard View using Seague -

i have following code checks connection server, , depending on want change views if no connection found. nsstring *connect = [nsstring stringwithcontentsofurl:[nsurl urlwithstring:@"http://myserver.com"] encoding:nsutf8stringencoding error:nil]; if (connect == null) { [self performseguewithidentifier:@"network_failure" sender:self]; } else { // other code here } my problem not change views. have added storyboard segue between 2 views identifier of network_failure . not have navigation controller or that, problem? thanks help! no not problem. first of all, in objectivec exists nil object oriented null . must use that. so: if(connect == nil) or better: if(!connect) so due fact nil not same of null , probably code does't enter in if scope . you have been able discover breakpoint. anyway: be sure set trigger segue (line) 2 view controller , , name network_failure (that not best name. should instead view1toview2 ) as, m...
Read more