You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@stratos.apache.org by Dakshika Jayathilaka <da...@wso2.com> on 2015/02/12 08:00:25 UTC
Re: [Dev] CSS overriding issue while using two JS libraries.
Hi,
I have checked both libs and didn't found any issue on it.
Here is working Fiddle: https://jsfiddle.net/dakshika/ukhgt3zq/
Regards,
*Dakshika Jayathilaka*
Software Engineer
WSO2, Inc.
lean.enterprise.middleware
0771100911
On Thu, Feb 12, 2015 at 12:13 PM, Dakshika Jayathilaka <da...@wso2.com>
wrote:
> Hi,
>
> I have checked both libs and didn't found any issue on it.
>
> Regards,
>
> *Dakshika Jayathilaka*
> Software Engineer
> WSO2, Inc.
> lean.enterprise.middleware
> 0771100911
>
> On Thu, Feb 12, 2015 at 11:59 AM, Mohammed Fawsan <fa...@wso2.com>
> wrote:
>
>>
>> I have been trying to create a Grid with Gridster <http://gridster.net/>.js,
>> The Grid also uses Bootstrap. I have used a tabbed nav bar for navigation.
>> They both use li items to add the items. And when I include both
>> gridster & bootstrap CSS files, gridster somehow overrides the bootstrap
>> CSS and it ruins the tabbed menu of bootstrap. What can I do to keep the
>> styles for both li items?
>>
>> PS : I have tried re arranging the order of both CSS files, It did not
>> work as well.
>>
>> HTML structure of gridster div
>>
>> <div class="gridster">
>> <ul>
>> <li data-row="1" data-col="1" data-sizex="1" data-sizey="1"></li>
>> <li data-row="2" data-col="1" data-sizex="1" data-sizey="1"></li>
>> <li data-row="3" data-col="1" data-sizex="1" data-sizey="1"></li>
>> </ul></div>
>>
>> HTML Structure of bootstrap div
>>
>> <ul class="nav nav-tabs">
>> ...
>> <li role="presentation" class="dropdown">
>> <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-expanded="false">
>> Dropdown <span class="caret"></span>
>> </a>
>> <ul class="dropdown-menu" role="menu">
>> ...
>> </ul>
>> </li>
>> ...</ul>
>>
>>
>>
>> -Regards
>> --
>> Mohammed Fawsan
>> Software Engineering Intern,
>> Faculty of Engineering, University of Peradeniya.
>> +94771121195
>>
>> _______________________________________________
>> Dev mailing list
>> Dev@wso2.org
>> http://wso2.org/cgi-bin/mailman/listinfo/dev
>>
>>
>
Re: [Dev] CSS overriding issue while using two JS libraries.
Posted by Dakshika Jayathilaka <da...@wso2.com>.
Sorry about the fiddle link:
Here is the correct one;
https://jsfiddle.net/dakshika/ukhgt3zq/2/
Regards
*Dakshika Jayathilaka*
Software Engineer
WSO2, Inc.
lean.enterprise.middleware
0771100911
On Thu, Feb 12, 2015 at 12:50 PM, Mohammed Fawsan <fa...@wso2.com> wrote:
> Hi Guys,
>
> Actually it was my mistake, There was a custom CSS file, That one seems to
> be the trouble maker. I have removed the conflicts and it works fine now.
>
> Thanks you & Sorry for the trouble caused.
>
>
>
> On Thu, Feb 12, 2015 at 12:42 PM, Mohammed Fawsan <fa...@wso2.com>
> wrote:
>
>> Hi Dhakshika,
>>
>> The Fiddle you have provided is empty. Can you please check that?
>>
>> -Regards
>>
>> On Thu, Feb 12, 2015 at 12:30 PM, Dakshika Jayathilaka <dakshika@wso2.com
>> > wrote:
>>
>>> Hi,
>>>
>>> I have checked both libs and didn't found any issue on it.
>>>
>>> Here is working Fiddle: https://jsfiddle.net/dakshika/ukhgt3zq/
>>>
>>> Regards,
>>>
>>>
>>> *Dakshika Jayathilaka*
>>> Software Engineer
>>> WSO2, Inc.
>>> lean.enterprise.middleware
>>> 0771100911
>>>
>>> On Thu, Feb 12, 2015 at 12:13 PM, Dakshika Jayathilaka <
>>> dakshika@wso2.com> wrote:
>>>
>>>> Hi,
>>>>
>>>> I have checked both libs and didn't found any issue on it.
>>>>
>>>> Regards,
>>>>
>>>> *Dakshika Jayathilaka*
>>>> Software Engineer
>>>> WSO2, Inc.
>>>> lean.enterprise.middleware
>>>> 0771100911
>>>>
>>>> On Thu, Feb 12, 2015 at 11:59 AM, Mohammed Fawsan <fa...@wso2.com>
>>>> wrote:
>>>>
>>>>>
>>>>> I have been trying to create a Grid with Gridster
>>>>> <http://gridster.net/>.js, The Grid also uses Bootstrap. I have used
>>>>> a tabbed nav bar for navigation. They both use li items to add the
>>>>> items. And when I include both gridster & bootstrap CSS files, gridster
>>>>> somehow overrides the bootstrap CSS and it ruins the tabbed menu of
>>>>> bootstrap. What can I do to keep the styles for both li items?
>>>>>
>>>>> PS : I have tried re arranging the order of both CSS files, It did not
>>>>> work as well.
>>>>>
>>>>> HTML structure of gridster div
>>>>>
>>>>> <div class="gridster">
>>>>> <ul>
>>>>> <li data-row="1" data-col="1" data-sizex="1" data-sizey="1"></li>
>>>>> <li data-row="2" data-col="1" data-sizex="1" data-sizey="1"></li>
>>>>> <li data-row="3" data-col="1" data-sizex="1" data-sizey="1"></li>
>>>>> </ul></div>
>>>>>
>>>>> HTML Structure of bootstrap div
>>>>>
>>>>> <ul class="nav nav-tabs">
>>>>> ...
>>>>> <li role="presentation" class="dropdown">
>>>>> <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-expanded="false">
>>>>> Dropdown <span class="caret"></span>
>>>>> </a>
>>>>> <ul class="dropdown-menu" role="menu">
>>>>> ...
>>>>> </ul>
>>>>> </li>
>>>>> ...</ul>
>>>>>
>>>>>
>>>>>
>>>>> -Regards
>>>>> --
>>>>> Mohammed Fawsan
>>>>> Software Engineering Intern,
>>>>> Faculty of Engineering, University of Peradeniya.
>>>>> +94771121195
>>>>>
>>>>> _______________________________________________
>>>>> Dev mailing list
>>>>> Dev@wso2.org
>>>>> http://wso2.org/cgi-bin/mailman/listinfo/dev
>>>>>
>>>>>
>>>>
>>>
>>
>>
>> --
>> Mohammed Fawsan
>> Software Engineering Intern,
>> Faculty of Engineering, University of Peradeniya.
>> +94771121195
>>
>
>
>
> --
> Mohammed Fawsan
> Software Engineering Intern,
> Faculty of Engineering, University of Peradeniya.
> +94771121195
>