about customize CSS styles

Hello,
im trying to create custom CSS for item viewing(not item submitting).
The issue is that i can overwrite via ITEM.CSS but i noticed that highest precedence is :
components/com_flexicontent/assets/css/flexicontent.css
which is system file which i dont want to override, so the problem is that my setting in ITEM.CSS is overwritten by same setting in system(FC) flexicontent.css
I also tried to create :
joomla_folder/templates/mytemplatename/css/flexicontent.css
(mytemplatename = my own template i duplicated from default template)
but its not recognized(not listed when i inspecting element in firefox)
I preffer the second way (my flexicontent.css
)to overdrive CSS settings, but i dont know why its not included.
In particular im interested in changing the FLOAT from left to right.
J! 3.1.5, FC 2.1.0 r1781
Appreciate any help ..

Hello

1. a CSS rule is "overwritten" as you call it by a rule that has higher precedence

-- just make your CSS rule of higher precedence (see CSS documenation)

e.g. you can copy the CSS rule inside item.css

and prepend to it a "body"
this will make it of higher precedence

see here:
How to customize CSS styles of FLEXIcontent

2. about flexicontent.css not loaded
if you have placed in correct folder path and with correct name, then it should appear , when you do "view page source"
in the browser, so do you see it when you do "view page source" in the browser?

Regards

Hi,
thank you for your reply,
1. Does it matter if in components/com_flexicontent/assets/css/flexicontent.css, my parameter i want to change is marked as
'!important; ? ie :
FLOAT : left !important;

this is the code in ITEM.CSS i want modify :
/* Field label & values styling */
span.flexi.label, .flexi.label {
display: block;
float: right ; /*this is the parameter i want to override original is "left"*/
border-bottom: 1px solid silver;
color: #777;
font-size: 90%;
margin-right: 8px;
}
how would you apply "body" to it ?

2. Unfortunately when i viewing the page source my
joomla_folder/templates/mytemplatename/css/flexicontent.css is not included ...
what is considered the right path ?
is it possible to have an example ?

Again, thanks for your time and patience.

Hello

1. about CSS please read CSS documentation in CSS related websites, etc

about FLEXIcontent this is helpful:

flexicontent.org/index.php/docum ... exicontent

2. about Joomla template customized CSS file: flexicontent.css, not appearing in HTML source

it could be a different/similar Joomla template loaded ?

you may send me a PM with super admin login
- mention the joomla template that you are using (just to verify that it is the one that you configured)
- provide a frontend example URL, that loads/uses this Joomla template

Regards

reading the link you provided i realized that may be its because i duplicated the default template (and edited the ITEM.CSS) AND also created my own
joomla_folder/templates/mytemplatename/css/flexicontent.css while, like the tutorial says, its or this or that, but not both together ... and perhaps if FC sees duplicated template it reads the ITEM.CSS first but then it does not including custom flexicontent.css
what do you think ?

Hello

no guessing

1. out of all CSS files loaded the higher precedence rule is applied

2.
joomla_folder/templates/mytemplatename/css/flexicontent.css

should be loaded if it exists

if you are sure that you created the above file at correct path but it is not loaded then you may send me a PM to check this

Regards