html - Bootstrap 3 Navbar with Icons & Carousel -

-

i working on creating site bootstrap3. unfortunately, after watching many videos still having problems.

  1. i logo on navbar remain on left side (which have) , other additional icons links other area of page toward left - unfortunately have not figured out via html/css. please check out www.frobot.net see attempting emulate. essentially, there multiple icons next text.

  2. i white background navbar , have definitive bottom rather meshing rest of website, if makes sense. of right now, there not consistent horizontal white area navigation tools.

  3. i set carousel 3 images , first image appears.

can please point out issues in code?

html: 

    <!doctype html>      <html>         <head>               <!-- website title & description search engine purposes -->             <title>the best yogurt</title>              <meta name="description" content="frozen yogurt">          <!-- mobile viewport optimized -->         <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">          <!-- bootstrap css -->         <link href="css/bootstrap.min.css" rel="stylesheet">         <link href="css/bootstrap-glyphicons.css" rel="stylesheet">          <!-- custom css -->         <link rel="stylesheet" href="css/style.css">          <!-- include modernizr in head, before other javascript -->         <script src="js/modernizr-2.6.2.min.js"></script>       </head>      <body>          <div class="container" id="main">              <nav class="navbar navbar-fixed-top" role="navigation">                  <div class="container-fluid">                      <div class="navbar-header">                          <a class="navbar-brand" href="#">                              <img src="img/logo.png" alt="#logo">                          </a>                      </div>                      <div class="navbar navbar-custom">                          <div class="navbar-header">                              <a class="icons" href="icons">                      <link href='http://fonts.googleapis.com/css?family=titillium+web' rel='stylesheet' type='text/css'>                      <a href="#"><img src="img/froyo.png" alt="froyo"<li>froyo</li></a>                      <a href="#"><img src="img/story.png" alt="bots"<li>bots</li></a>                      <a href="#"><img src="img/team.png" alt="press"<li>press</li></a>                      <a href="#"><img src="img/talk.png" alt="team"<li>team</li></a>                      <a href="#"><img src="img/contact.png" alt="contact"<li>contact</li></a>                  </div>              </nav><!--end nav bar -->          </div>          <!-- carousel begins -->          <div class="carousel-slide" id="mycarousel">              <!-- indicators -->              <ol class="carousel-indicators">                 <li class="active" data-slide-to="0" data-target="#mycarousel"></li>                 <li data-slide-to="1" data-target="#mycarousel"></li>                 <li data-slide-to="2" data-target="#mycarousel"></li>             </ol>              <!-- wrapper slides -->             <div class="carousel-inner">                 <div class="item active" id="slide1">                     <div class="carousel-caption">                         <h4></h4>                         <p></p>                     </div><!-- end carousel-caption-->                 </div><!-- end item -->                   <div class="item" id="slide2">                     <div class="carousel-caption">                         <h4></h4>                         <p></p>                     </div><!-- end carousel-caption-->                 </div><!-- end item -->                  <div class="item" id="slide3">                     <div class="carousel-caption">                         <h4></h4>                         <p></p>                     </div><!-- end carousel-caption-->                 </div><!-- end item -->             </div><!-- carousel-inner -->              <!-- controls -->             <a class="left carousel-control" data-slide="prev" href="#mycarousel"><span class="icon-prev"></span></a>             <a class="right carousel-control" data-slide="next" href="#mycarousel"><span class="icon-next"></span></a>          </div><!-- end mycarousel -->          <div class="row" id="froyo">              <a href="#"><img src="img/contact-para-bg.png" alt="bots"</a>   </body> </html>  css:  /* --------------------------------------    layout    -------------------------------------- */     .nav-bar {           position:fixed;          top:0;          background-color:white;          padding-top:30px;          padding-left:100px;    }     .navbar-brand {      padding: 13px 15px;      background-color:white; }      .icons {          margin:0;          padding-top: 25px;          padding-right: 200px;          padding-left:100px;          background-color:white;       }      .icons a{          font-family: 'titillium web', sans-serif;          text-decoration: none;          float: left;          display: block;          padding: 20px 15px;          color:gray;          background-color:white;      }      .icons a:hover{          color:purple;     }      * --------------------------------------    carousel    -------------------------------------- */  #mycarousel {     margin-top: 300px;     background-color:gray; }  .carousel-caption {     font-size: 24px; }  .carousel-caption h4 {     font-size: 32px;  }   #mycarousel .item { height: 700px; }  #slide1 {     background: url('../img/best-slide.png') top center no-repeat; }  #slide2 {     background: url('../img/good.png') top center no-repeat; }  #slide3 {     background: url('../img/slide3.png') top center no-repeat; }

you can throw bottom border on navbar , modify css of border make space between navbar , rest of page. forgot data-ride="carousel" in div tag carousel.


Comments

Post a Comment

Popular posts from this blog

PHP DOM loadHTML() method unusual warning -

-
i had following code works fine on localhost: $document = new domdocument(); $document->loadhtml($p_result); $form = $document->getelementsbytagname('form')->item(0); // code continues using $form variable after same code updated on outside server, loadhtml() failed , issued warning. warning: domdocument::loadhtml() expects parameter 1 valid path, string given in path/name/to/script.php returned null instead of object code pretty gets fatal error. note contents of $p_result absolutely same on outside server , on localhost. but why displays kind of warning , why not work? doesn't loadhtml() expects argument 1 string in first place? why method expects parameter 1 valid path ? just make clear i'm not calling loadhtmlfile() , i'm calling loadhtml() . thanks. you're affected one of php bugs . issue present in php 5.6.8 , 5.6.9. have affected php version on server, , bug-free version on localhost. the bug forbids null
Read more

python - How to create jsonb index using GIN on SQLAlchemy? -

-
here's current code creating index jsonb. index("mytable_data_idx_id_key", mytable.data['id'].astext, postgresql_using='gin') but got error. sqlalchemy.exc.programmingerror: (psycopg2.programmingerror) data type text has no default operator class access method "gin" hint: must specify operator class index or define default operator class data type. [sql: "create index event_data_idx_id_key on event using gin ((data ->> 'id'))"] is there way create index on sqlalchemy? the postgresql specific sqlalchemy docs @ http://docs.sqlalchemy.org/en/latest/dialects/postgresql.html#operator-classes mention postgresql_ops dictionary provide "operator class" used postgresql, , provide example illustrating use: index('my_index', my_table.c.id, my_table.c.data, postgresql_ops={ 'data': 'text_pattern_ops',
Read more

c# - TransactionScope not rolling back although no complete() is called -

-
i'm using transactionscope rollback transaction fail bool errorreported = false; action<importerrorlog> newerrorcallback = e => { errorreported = true; errorcallback(e); }; using (var transaction = new transactionscope()) { foreach (importtaskdefinition task in taskdefinition) { loader.load(streamfile, newerrorcallback, task.destinationtable, processingtaskid); } if (!errorreported) transaction.complete(); } i'm sure there no transactionscope started ahead or after code. i'm using entity framework insert in db. regardless state of errorreported transaction never rolled in case of error. what missing ? transactionscope sets transaction.current . that's does. wants transacted must @ property. i believe ef each time connection opened reason. probably, connection open when scope installed. open connection inside of scope or enlist manually. ef has nasty "design decision": default opens
Read more