Hi Federico!
You're missing the styles for the class .navbar-collapse and .navbar-form
(and others but didn't find them all now, but it's a starting point), here
i've copied some of them from http://getbootstrap.com/components/#navbar,
looks a bit better now :)
*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.navbar-form {
padding: 10px 15px;
margin-top: 8px;
margin-right: -15px;
margin-bottom: 8px;
margin-left: -15px;
border-top: 1px solid #e6e6e6;
border-bottom: 1px solid #e6e6e6;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0
rgba(255, 255, 255, 0.1);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255,
255, 0.1);
}
@media (min-width: 768px) {
.navbar-form .form-group {
display: inline-block;
margin-bottom: 0;
vertical-align: middle;
}
.navbar-form .form-control {
display: inline-block;
}
.navbar-form .radio,
.navbar-form .checkbox {
display: inline-block;
padding-left: 0;
margin-top: 0;
margin-bottom: 0;
}
.navbar-form .radio input[type="radio"],
.navbar-form .checkbox input[type="checkbox"] {
float: none;
margin-left: 0;
}
}
@media (max-width: 767px) { .navbar-form .form-group { margin-bottom: 5px;
} } @media (min-width: 768px) { .navbar-form { width: auto; padding-top: 0;
padding-bottom: 0; margin-right: 0; margin-left: 0; border: 0;
-webkit-box-shadow: none; box-shadow: none; } } .navbar-collapse {
max-height: 340px; padding-right: 15px; padding-left: 15px; overflow-x:
visible; overflow-y: auto; border-top: 1px solid #e6e6e6; box-shadow: inset
0 1px 0 rgba(255, 255, 255, 0.1); -webkit-overflow-scrolling: touch; }
.navbar-collapse:before, .navbar-collapse:after { display: table; content:
" "; } .navbar-collapse:after { clear: both; } .navbar-collapse:before,
.navbar-collapse:after { display: table; content: " ";
} .navbar-collapse:after { clear: both; }
@media (min-width: 768px) {
.navbar-collapse { width: auto; padding-right: 0; padding-left: 0;
border-top: 0; box-shadow: none; }
.navbar-collapse.collapse {
display: block !important; height: auto !important; padding-bottom: 0;
overflow: visible !important; } .navbar-collapse.in { overflow-y: visible;
} }
And, you are using the same data-toggle for both navbars, change the class
in line 103 & 109 from .navbar-ex1-collapse to e.g. .navbar-ex2-collapse
regards
Gerd
Am Freitag, 16. August 2013 11:26:48 UTC+2 schrieb Federico Perez:
>
> Line 40 & 51 look wrong to me
>
> Thanks, but I don't understand exactly what you mean. What is looking
> wrong to you? Those lines are the same as in the example.
>
>
> El jueves, 15 de agosto de 2013 23:52:34 UTC+2, James Saint escribió:
>>
>> data-toggle="collapse" data-target=".navbar-ex1-collapse"
>>
>>
>> Line 40 & 51 look wrong to me
>>
>> On Thursday, 15 August 2013 20:52:12 UTC+1, Federico Perez wrote:
>>>
>>> Hi,
>>>
>>> I have this site: http://www.ziiweb.com/, at the top there is a copy of
>>> the responsive navbar of BS 3:
>>>
>>> http://getbootstrap.com/components/#navbar
>>>
>>> but in my case I can not see the items in the menu when I have a large
>>> size browser, why?
>>>
>>> No problem to see the three stripes button when the browser becomes
>>> smaller.
>>>
>>>
--
You received this message because you are subscribed to the Google Groups
"twitter-bootstrap" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/groups/opt_out.
