nav

Problems aligning my logo with the navigation bar

谁都会走 提交于 2021-02-19 08:43:27
问题 I've been sat here for 2 hours simply tring to align my logo with the navigation bar so it all fits on one line similar too http://weightshift.com/ Im trying too add this image http://imageshack.us/photo/my-images/26/logonkg.png/ to align with the navigation bar im using which uses the following CSS, and am really stuck everytime i try to align it the nav bar goes below the header, im creating this on dreamweaver using the responsive framework, help would be greatly appreciated. #menu {

I need help making CSS for a modern vertical navbar

这一生的挚爱 提交于 2021-02-17 03:06:30
问题 I have been playing around with a (I think) pretty modern vertical nav bar, I've gotten it pretty much down, however its like not really responsive, like at all. And its better off if its rewritten. Any help is appreciated :), or if you have any video that you know of or found that'll gear me in the direction that'll work too! I've tried making a two normal sections one section thats about 8vw wide and goes all the way down and then having a second section thats, well, for the rest of my

I need help making CSS for a modern vertical navbar

谁说胖子不能爱 提交于 2021-02-17 03:04:19
问题 I have been playing around with a (I think) pretty modern vertical nav bar, I've gotten it pretty much down, however its like not really responsive, like at all. And its better off if its rewritten. Any help is appreciated :), or if you have any video that you know of or found that'll gear me in the direction that'll work too! I've tried making a two normal sections one section thats about 8vw wide and goes all the way down and then having a second section thats, well, for the rest of my

动手练习——底部彩条移动型nav

牧云@^-^@ 提交于 2021-02-14 21:51:01
效果如图: 兼容:IE6+、chrome、firefox、safari等 源代码如下:(直接复制即可运行) <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>test</title> <style type="text/css"> body,ul,li,a{ margin: 0; padding: 0; list-style: none; text-decoration: none; } #nav li{ float: left; width: 150px; text-align: center; padding: 5px 0; } #nav li a{ display: inline-block; width: 100%; font-family: "Microsoft YaHei"; color: #3C3C3C; font-size: 18px; font-weight: 700; border-left: 1px solid #E5E5E5; } #nav li a.first{ border-left: 0 none; } #nav li

动手练习——展开式nav

谁说胖子不能爱 提交于 2021-02-14 21:38:25
效果: 兼容:IE6+、chrome、firefox、safari等。 源代码:(直接复制即可运行) <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>导航</title> <style type="text/css"> /* reset */ body { margin: 0; padding: 0 0 12px 0; font-size: 12px; line-height: 22px; } form, ul, li, p, h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; } input, select { font-size: 12px; line-height: 16px; } img { border: 0; } ul, li { list-style-type: none; } a { color: #00007F; text-decoration: none; } a:hover { color: #bd0a01; text-decoration: underline; } .box {

How do I center the Zurb Foundation top bar nav?

拟墨画扇 提交于 2021-02-06 04:23:25
问题 The top bar nav on my site is left aligned like this: | Home | aveoTSD | Silent Nite | I would like to center the top bar nav like this: | Home | aveoTSD | Silent Nite | Center it exactly like the red bar with "Example" text. Here is my css. 回答1: You can do it by adding this to your CSS (and preferably removing conflicting styles): .top-bar-section ul {display: table; margin: 0 auto;} .top-bar-section ul li {display: table-cell;} 回答2: Found this to be helpful: https://github.com/zurb

Hover underlining only text within a flexbox

拈花ヽ惹草 提交于 2021-01-29 07:52:52
问题 I'm trying to get an underline to work on hover on a vertical nav made with flexbox . On a horizontal nav without flexbox the hover underline works fine, but as soon as flexbox is added the underline spans the entire box rather than just under the text. See how in the first snippet below it works as intended but as soon as I make main_nav vertical with flexbox in the second snippet the underline breaks. How can I fix this so it underlines correctly while keeping the nav vertical? #wrapper {

Trying to add an image logo inside a boostrap logo

五迷三道 提交于 2021-01-28 21:53:37
问题 I have the following nav bar code and as you can see I have tried to add an image as a logo instead of text. The below doesn't work. <li class="nav-item"> <a class="nav-link active" aria-current="page" img src="https://www.pngfind.com/pngs/m/572-5720766_eye-logos-png-image-with-transparent-background-eyelid.png">Home</a> </li> Also tried: <a class="nav-link active" aria-current="page" >img src="https://www.pngfind.com/pngs/m/572-5720766_eye-logos-png-image-with-transparent-background-eyelid

Nav with div inside (two different menus)

大城市里の小女人 提交于 2021-01-28 07:53:18
问题 I made an image of what I would like to do, sort of, but I cant seem to work it out. What I would like: I currently have the nav but it is all in a div, what I want to do, is to divide it, have two different divs and each with different content. Here's my actual code. UPDATED: CSS #nav { position:fixed; top: 0; left: 0; width: 100%; height:7%; text-align: center; padding: .5em 0 1em 0; z-index: 1; overflow: hidden; background-image: -webkit-gradient( linear, right top, left bottom, color-stop

Bootstrap navbar overlapping body content

戏子无情 提交于 2021-01-27 01:41:27
问题 I am having some issues with my Bootstrap navbar. I have a lot of tabs in the navbar so the header gets on separate line and the tabs get on 2nd line which doesn't look good. because navbar takes 2 line so it hides some content on my page, for example there is a heading above line "Please select cluster avg file...." in the attached image but you cant see it because navbar is overlapping and hiding it. How can I fix this issue? I want the navbar to show only limited tabs , as possible in one