Unordered List Items are not displaying in horizontal
-
Hi all dears, I have an unordered list, the items in the list are diaplyed vertical always, I am trying different approaches, but still not working, I set the inline style attribute display, to flex or inline but nothing works, can anybody please help me who has gone through the same issue anytime previously.
import React from 'react';
import { connect } from 'react-redux';
import '../css//bootstrap.css'
import xxxHeader from '../images/header/xxxclassic-ca.png'
import xxxClassicTwitter from '../images/header/xxxclassic-twitter.png'
import xxxx from '../images/header/xxxclassic-linkedin.png'
import CalxxxxInfo from '../images/header/xxxclassic-ytube.png'
import xxxxClassicEmail from '../images/header/xxxclassic-email.png'
import HeaderOrganization from '../images/header/header_organization.png'const divStyle = {
display: 'flex',
alignItems: 'center'
};const HeaderMenu = (props) => (
* [](http://www.xxxx.xxx) * [](https://twitter.com/xxxxResources) * [](https://www.youtube.com/user/calxxxxinfo) * [](https://www.linkedin.com/company/california-xxxx-resources-board) * [](https://public.govdelivery.com/accounts/xxxx/subscriber/new?topic_id=listserv) [](http://xxx.xxxx.xxx)
-
Hi all dears, I have an unordered list, the items in the list are diaplyed vertical always, I am trying different approaches, but still not working, I set the inline style attribute display, to flex or inline but nothing works, can anybody please help me who has gone through the same issue anytime previously.
import React from 'react';
import { connect } from 'react-redux';
import '../css//bootstrap.css'
import xxxHeader from '../images/header/xxxclassic-ca.png'
import xxxClassicTwitter from '../images/header/xxxclassic-twitter.png'
import xxxx from '../images/header/xxxclassic-linkedin.png'
import CalxxxxInfo from '../images/header/xxxclassic-ytube.png'
import xxxxClassicEmail from '../images/header/xxxclassic-email.png'
import HeaderOrganization from '../images/header/header_organization.png'const divStyle = {
display: 'flex',
alignItems: 'center'
};const HeaderMenu = (props) => (
* [](http://www.xxxx.xxx) * [](https://twitter.com/xxxxResources) * [](https://www.youtube.com/user/calxxxxinfo) * [](https://www.linkedin.com/company/california-xxxx-resources-board) * [](https://public.govdelivery.com/accounts/xxxx/subscriber/new?topic_id=listserv) [](http://xxx.xxxx.xxx)
You most likely have rules in the
header-top
ornav
CSS classes with!important
set, which overrides the style attribute. Try using your browser's developer tools to inspect the list element to see what's going wrong.
"These people looked deep within my soul and assigned me a number based on the order in which I joined." - Homer
-
You most likely have rules in the
header-top
ornav
CSS classes with!important
set, which overrides the style attribute. Try using your browser's developer tools to inspect the list element to see what's going wrong.
"These people looked deep within my soul and assigned me a number based on the order in which I joined." - Homer
Sure thank you Richard, yeah actually I did - thanks Richard
-
Hi all dears, I have an unordered list, the items in the list are diaplyed vertical always, I am trying different approaches, but still not working, I set the inline style attribute display, to flex or inline but nothing works, can anybody please help me who has gone through the same issue anytime previously.
import React from 'react';
import { connect } from 'react-redux';
import '../css//bootstrap.css'
import xxxHeader from '../images/header/xxxclassic-ca.png'
import xxxClassicTwitter from '../images/header/xxxclassic-twitter.png'
import xxxx from '../images/header/xxxclassic-linkedin.png'
import CalxxxxInfo from '../images/header/xxxclassic-ytube.png'
import xxxxClassicEmail from '../images/header/xxxclassic-email.png'
import HeaderOrganization from '../images/header/header_organization.png'const divStyle = {
display: 'flex',
alignItems: 'center'
};const HeaderMenu = (props) => (
* [](http://www.xxxx.xxx) * [](https://twitter.com/xxxxResources) * [](https://www.youtube.com/user/calxxxxinfo) * [](https://www.linkedin.com/company/california-xxxx-resources-board) * [](https://public.govdelivery.com/accounts/xxxx/subscriber/new?topic_id=listserv) [](http://xxx.xxxx.xxx)
li
{
margin:10px;
float:left;
} -
li
{
margin:10px;
float:left;
}Thank you mere dost