html5 - Dropdown Problems on Navbar -

-

Sorry if this is so easy, but I'm having problems with my navbar which I am making.

I have problems when hovering over ul of the dropdown menu li is not set as active and another issue is that when you < Code> ul , the link is pushed on the right side.

If you want to see an example here

If any of these require Jquery or regular JS, which I do not think it does, then I would reply here. I am

This is my code.

HTML & lt; Div class = "navbar" & gt; & Lt; A href = "#" class = "brand" & gt; & Lt; Img src = "img / shattered.png" / & gt; Test & lt; / A & gt; & Lt; Ul class = "navbar-nav" & gt; & Lt; Div class = "container" & gt; & Lt; Li class = "active" & gt; & Lt; A href = "#" & gt; Active & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Hover & lt; / A & gt; & Lt; / Li & gt; & Lt; Li class = "dropdown" & gt; & Lt; A href = "#" & gt; Dropdown & lt; B square = "carat" & gt; & Lt; / B & gt; & Lt; / A & gt; & Lt; Ul class = "dropdown menu" & gt; & Lt; Li class = "active" & gt; & Lt; A href = "#" & gt; Inbox & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Draft & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Sent items & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Trash & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt; & Lt; / Div & gt; & Lt; / Ul & gt; & Lt; / Div & gt;

CSS 

  body {margin: 0; Background Image: URL (../img/shattered.png); Background position: center; Background repeat: repeat; Font-family: helvetica, sans-serif; }. Container {Padding: 0 10%; } .navbar {status: fixed; Top: 0; Width: 100%; } .navbar-nav {background-color: #fff; Minute-height: 50px; Border bottom: 3px solid # ccc; Padding-right: 10px; Margin: 0; } .navbar .brand {margin-left: 50px; Margin-right: 50px; Display: inline-block; Color: # 333; Font-size: 20px; Text-decoration: none; Swim left; Line-height: 50px; } .navbar .brand: hover {animation: shake .75 s; Webkit-Animation: Shake .75s; -MOZ-Animation: Shake .75 s; -a-animation: shake .75s; } .navbar .brand img {padding-right: 10px; Height: 50px; Width: 50px; Swim left; } .navbar-nav li {display: inline-block; Margin-right: -4px; List-style: none; } .navbar-nav & gt; Container & gt; Le & gt; A {font-size: 17px; Display: inline-block; Text-decoration: none; Color: # 333; Padding: 15px 15px; } .navbar-nav & gt; Container & gt; Le & gt; One: hover {background color: #iffeff; Transition: Ease Out-Out. 25 S; } .navbar-nav & gt; Container & gt; . Active & gt; A {background color: #ddd; } .navbar-nav & gt; Container & gt; . Active & gt; One: hover {background color: #ddd; } .navbar-nav & gt; Container & gt; .pull-right {float: right; } .navbar-nav & gt; Container & gt; Le & gt; One & gt; .caret {Display: Inline-Block; Width: 0 pixels; Height: 0 pixels; Margin-left: 2px; Vertical-row: middle; Border bottom: None; Border-top: 4px solid # 333; Border-right: 4px solid transparent; Border-left: 4px solid transparent; Border-bottom-width: 0 pixels; Border-top-style: dotted; } .navbar-nav & gt; Container & gt; Li ul {display: none; } .navbar-nav & gt; Container & gt; Li: Hover UL {display: block; Background color: #fff; Status: Completed; Border-bottom-right-radius: 5px; Border-bottom-left-radius: 5px; } .navbar-nav & gt; Container & gt; Le & gt; UL & gt; Li {display: Block; } .navbar-nav & gt; Container & gt; Le & gt; UL & gt; Le & gt; A {display: block; Padding: 5px 20px; Text-decoration: none; Font-size: 15px; } .navbar-nav & gt; Container & gt; Le & gt; UL & gt; Le & gt; One: hover {background-color: # by; }    
 
 
 Fixed:  
 converted to CSS:    ul padding: 0; Fixed padding in / * ul. Active. Active: Hover {background color: #ddd; }

Comments

Post a Comment

Popular posts from this blog

ios - Adding an SKSpriteNode to SKScene from a child SKSpriteNode -

-
I have a SKScene where I am adding an SKSpriteNode I have subclassed the SKSpriteNode class to create this node. In the subclass I am defining some SKActions on Sprite. What do I want to do when the end of this phantom ends the SKAction sequence, then I add a new Prayer node to this scene. How is this possible. The following code is mine: The code for the sequence is that I'm running on the Scansprinitode subclass (TEMissileNode): - SKAction * moveDown = [SKAction moveToY: Self.position.y - 20 Duration: 0.2]; SKAction * animation = [SKAction animateWithTextures: textures timePerFrame: time / 7]; SKAction * moveMissileProjectile = [SKAction Moving: Pointoffscreen Term: Time]; SKAction * group = [SKAction group: @ [animation, movement projectile]]; SKAction * Sequence = [SKAction Sequence: @ [Hilldown, Group, [SKAction removalFromParent]]]; [Self run action: sequence]; From the main scene, I call those actions that execute these tasks TEMissileNode * missile = [tmissil...
Read more

Matlab transpose a table vector -

-
An embarrassing simple question seems to be, but how can I move a Matlab table vector? aTableT = aTable '; I tried a standard syntax for the simple interaction of a line vector to a line vector aTable : ATableT = reshape (aTable, 1, Height (aTable)); and aTableT = rot90 (aTable); According to the head, the last time table should work for table, see. However, I get this error code: Error type in using table / permit (line 396) Undefined function 'permute' for the input arguments. Error in rot 90 (line 29) b = magnitude (b, [2 1 3: ndims (a)]); NB: fliplr is not useful either pretty sure I have covered clear angles - any ideas? Thanks! Try changing your table into an array, move it, then back to a table In other words, try doing this: aTableArray = table2array (aTable); ATableT = array 2table (aTableArray. '); I have also read the document for rot90 , and it says that rot90 is definitely working for tables Do, and I find you...
Read more

c# - Textbox not clickable but editable -

-
I have a small form with 10 text boxes, I have set them in the correct tab order. I want them on my tab service I was wondering if there is a way to set the text box so that they can be selected for editing until they are tabbed. That is ... I do not want the end user to edit the text box to click on them, I just want to make them editable through tabu. this should do the trick public partial category poor text box: Text Box {Safe Override Zero WndProc (Ref: Message Message) {if (m.msg == (Int) WM.LBUTTONDOWN) {Return; // mount down events} base.WndProc (ref m); }} Window message enum can be found. How to do this without anherizing: text box : class EatMouseDown: netwindows {safe override zero WndProc (ref message message) {if (m.msg == (int) WM.LBUTTONDOWN) {return; } Base.WandProc (Ref M); }} Safe Override Zero Onload (EventEurge E) {base.OnLoad (e); How to do this without any part: left a clean part, whatever is important, this can be a buggy but it works R...
Read more