Strange! It's 980px width for me. Eh?
Can't help with the dropdown though I'm afraid.
On Wednesday, February 20, 2013 6:16:05 PM UTC, Tom Brossman wrote:
>
> Sorry, no idea. Maybe try a new question about the dropdown not appearing
> in IE8?
>
> On Wednesday, February 20, 2013 5:27:29 PM UTC, Olli . wrote:
>>
>> Hi,
>> But it does not work with IE 8 =( The dropdown menu items don't appear at
>> all. Any advice?
>> Olli
>>
>> keskiviikko, 20. helmikuuta 2013 19.25.08 UTC+2 Olli . kirjoitti:
>>>
>>> Hi,
>>> That worked very well but dropdowns caused problems. Here is the fixed
>>> version, which should work! =)
>>>
>>> @media (min-width: 940px) {
>>> .navbar .navbar-inner {
>>> padding: 0;
>>> }
>>> .navbar .nav {
>>> margin: 0;
>>> display: table;
>>> width: 100%;
>>> }
>>> .navbar .nav > li {
>>> display: table-cell;
>>> width: 1%;
>>> float: none;
>>> }
>>> .navbar .nav > li > a {
>>> font-weight: bold;
>>> text-align: center;
>>> border-left: 1px solid rgba(255,255,255,.75);
>>> border-right: 1px solid rgba(0,0,0,.1);
>>> }
>>> .navbar .nav > li:first-child a {
>>> border-left: 0;
>>> border-radius: 3px 0 0 3px;
>>> }
>>> .navbar .nav > li:last-child a {
>>> border-right: 0;
>>> border-radius: 0 3px 3px 0;
>>> }
>>> }
>>>
>>> Olli
>>>
>>> keskiviikko, 20. helmikuuta 2013 18.43.36 UTC+2 Tom Brossman kirjoitti:
>>>>
>>>> I ran into this problem today and figured it out using 'SebastianG''s
>>>> advice in this
>>>> post<http://stackoverflow.com/questions/14448499/style-twitter-bootstrap-navbar-witout-applying-that-styling-to-collapsed-navbar>on
>>>> Stack Overflow.
>>>>
>>>> You need to wrap the CSS styling for that justified navbar in an *@media
>>>> query*. The break point for this specific template is 940px, so here
>>>> is what I have now, tested and working:
>>>>
>>>> /* Customize the navbar links to be fill the entire space of the
>>>> .navbar */
>>>> @media (min-width: 940px) {
>>>> .navbar .navbar-inner {
>>>> padding: 0;
>>>> }
>>>> .navbar .nav {
>>>> margin: 0;
>>>> display: table;
>>>> width: 100%;
>>>> }
>>>> .navbar .nav li {
>>>> display: table-cell;
>>>> width: 1%;
>>>> float: none;
>>>> }
>>>> .navbar .nav li a {
>>>> font-weight: bold;
>>>> text-align: center;
>>>> border-left: 1px solid rgba(255,255,255,.75);
>>>> border-right: 1px solid rgba(0,0,0,.1);
>>>> }
>>>> .navbar .nav li:first-child a {
>>>> border-left: 0;
>>>> border-radius: 3px 0 0 3px;
>>>> }
>>>> .navbar .nav li:last-child a {
>>>> border-right: 0;
>>>> border-radius: 0 3px 3px 0;
>>>> }
>>>> }
>>>>
>>>>
>>>> Don't forget that last right curly-brace at the bottom, to close the
>>>> @media query. This leaves the mobile (dropdown) version with the default
>>>> styling which already looks fine and doesn't need anything else.
>>>>
>>>> This should really be part of the default example template. I just
>>>> spent hours trying to get this perfect. Hope it helps you.
>>>>
>>>> On Sunday, 10 February 2013 10:49:21 UTC, Olli . wrote:
>>>>>
>>>>> Hi,
>>>>>
>>>>> How could I make justified nav example responsive
>>>>> http://twitter.github.com/bootstrap/examples/justified-nav.html
>>>>>
>>>>> thanks
>>>>> Olli
>>>>>
>>>>
--
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.
