User Account Control Page Display Bad

-- url of the page with the problem -- : www.ariesgamesandminis.com
-- HikaShop version -- : 3.0.1
-- Joomla version -- : 3.6.5
-- PHP version -- : 7
-- Browser(s) name and version -- : Chrome

First, I know my HikaShop is out of date (as is Joomla). I need to resolve a issues with both on a test site I installed the newest version on before I update my live site.

My user account control page is not displaying properly. I have NO idea how long this has gone on...but I've tried to investigate the issue myself and need some direction.

First off, please see the attached images. This shows both before (checked) and after (unchecked) I toyed around with the investigate tool within chrome. I still cannot figure out how to make the associated images larger though.

Any direction would be helpful as I'm a bit unsure on what to do. I have (per memory) never changed the CSS for the User Account Control page...so I'm not sure why this is happening.

Thanks!

Checked

Jerome...thank you for your reply. Sorry for my very tardy reply myself...all sorts of bad stuff broke loose over the last few days.

So if I'm understanding you correctly, the front end CSS will now change periodaclly without warning, and as such, any modifications I do should be done to the "Styles for the front-end" section right?

If so...what would happen if I simply copied over my current front end CSS settings, and placed them into the "Styles for the front-end"?

Jerome, not sure why...but you seem offended. I am simply not understanding you. I'm not a webmaster. I am still learning as much as I can, so I'm asking questions.

You said...

"We now recommend to try to keep the "frontend default" CSS and use the "style" to create your customization.
Depending how your CSS is already customized, it would be easier to add the missing rules in your current used file."

I'm asking you...can I copy the current Front End CSS items over to the style sheet? What would happen if I did? I don't plan on doing this to the live site yet...I'm asking for what can happen, if it is recommended, what would your advice be...etc.

Jerome and/or Nicolas...I'm still oddly having this issue. Attached are new images.

I know where to change the CSS file, but...of course when I do, and there's an update, all changes revert to their original state.

So where exactly should I copy these changes to? I'm using a Rocket Theme template if that matters. I have tried all the previous posts, and it doesn't seem to work for me, or...I'm doing it wrong.

Images attached are as follows:

User Control Panel - This is how it looks to customers (on a computer) when they access it
BEFORE Editing User Control Panel - The red circled area is the part that I need to edit
EDITED User Control Panel - This is how I'd like it to look and the red circled area are the changes I made

Thank you!

nicolas wrote: Hi,

As we said previously, you should add your CSS custom code in the "style" CSS file and not the "frontend" CSS file (the option below). OR you can also add your custom CSS code to your template. Some templates provide a way to add your custom CSS somewhere. You have to check with your template provider regarding that.

Regarding the user control panel, if you reverted to the "default" selection of the "frontend" HikaShop CSS file and you still have a display issue, then please also delete the file templates/YOUR_TEMPLATE/com_hikashop/user/cpanel.php in order to use the default view file of HikaShop.

}
[class^="icon-"],
[class*=" icon-"] {
	display: inherit;
	width: 100px;
	height: 75px;
	*margin-right: .3em;
	line-height: 25px;
}

Philip wrote: Hello,

You use a too generic selector, and of course that will modify the whole site page.
You have to create a more specific selector :

.specific_page_class .html_element_class {
/* Your command css */
}

And so, your custom code will be applied only on the page with that specific page.
Regards

[class^="icon-"],
[class*=" icon-"]

That helps...I think...

In the attached images, which of the the highlighted area is the one I need to list?

Image 1

Ok...so I put this in the custom CSS and it isn't working. What am I not understanding?

div.hikashop_cpanel_main{
	display: inherit;
	width: 100px;
	height: 75px;
	*margin-right: .3em;
	line-height: 25px;
}

Jerome, I'm sorry, but I don't know what any of that means. Can you please elaborate and help me get this working? Thank you

Philip wrote: Hello,

First you can have a look on this Css reference .

From the code you have provided, your selector aim the container, and not directly the concerned html element, your span.
By example :

.page_id .container_class .html_element_class {
// Your Css command
}

Hope this will help you.
Regards