I want to locate the location of the css inline item so that I can edit the background color of a horizontal menu.
This is what the css looks like:
ul#megamenupro_1 li.menu-item-link a { background: none repeat scroll 0%
0% #5EA032 !important; )
The firefox inspector is telling me that it's an inline item.
I want to change the #5EA032 colored background to another color. The thing is, it's an inline css so I don't know where to find it in magento. I tried looking in page.xml, header.phtml, theme.css, and style.css but it doesn't seem to be in any of these.
Does anyone have any suggestions on how to locate inline css items in magento, or where it could possibly be located? I would like to change the background color.
Thank you!
Please go to
System >> Configurations >> Developer
then select the required store view from Current Configuration Scope from top left drop-down. Then under Debug tab, enable the Template Paht hints and save. Once done, refresh your frontend page, you will see paths to all files shown in red. Use firebug in Firefox browser to locate the inline css and get the file name and path.
Related
I have jssor slideshow module installed on my drupal 8 site. I am trying to have the arrows on the slides to navigate the slideshow. The problem is something is adding
display: none;
to my arrows. When I remove the the line in the terminal the arrow appears but when I put my mouse back on the page out of the terminal window the arrow disappears and the
display: none;
line is back.
What causes this and how can I stop it?
Have you tried adding display: block !important; ? I often have to use the !important to stop my CSS being overridden by other modules.
The preferred method of resolving this kind of issue is to ensure that the CSS files are being loaded in the correct order (it is Cascading Style Script after all). However in this instance, and as is often the case with CMS type sites (or those where you don't have access to changing the loading order of the CSS files), the !important declaration is the solution.
Im currently working on a joomla homepage.
Im trying to locate the file that contains css for a specific item with the id of 472.
afaik there is a css file somewhere with css information relative to this object.
i just cant find it. anybody who can help me?
1st edit: when i inspect the element in chrome and change the css of the item to my needs it works as i want it. problem is i cant find the css in my css documents. i already tried looking through the css linked in the resources tab and there was nothing there.
the code can be viewed here: http://www.denz.dk
basicly what i want is to move the "indkøbskurv" to the right side of the menu.
Your menu css is being controlled by:
http://www.denz.dk/templates/yougrids/css/menus.css
http://www.denz.dk/templates/yougrids/css/mesh.css
to modify the css for that specific item, add something like this to one of those files:
.horiznav .item472 {
/* your style */
}
I have a CSS file which is not written by me, but I have to change stuff. My problem is a line like this:
list-style-image: url("../images/pfeil.png");
The path to the image is correct, but it's not displayed. I used Firebug to check which styles are applied and I see the line is stroke through. According to the documentation, that means that it's overwritten by another rule.
Is there a way / tool to find out, which rule is overwriting the line above?
They are not disabled. These entries have a strike through them to signify they have been reset or overwritten by a newer rule (one loaded after this style sheet for instance).
CSS styles are loaded in order of inclusion on the html page, with inline styles taking priority over CSS sheet definitions.
Firebug will show you which one has overwritten this one if you just review all CSS acting on that element. Just look for any other list-style-image: listed.
Open your page in chrome, hit ctrl, shift I to open developers console. On the right, there should be an accordion thingy with one of the options being "Computed Style". Open that, click on show inherited, find the setting your concerned about, click the little arrow next to it and it should open up and tell you where the computed setting is coming from.
Let me know if that does it for you.
Cakephp is giving me some problems as I have set as below (I have tried any number of urls, through localhost, placing it in webroot and giving reference from that file, giving full route from localhost (this is a local test ubuntu machine, not a 3rd party server), etc, etc but it just doesn't show up.. I am using a custom layout that overrides the default layout and, as far as I can tell, it contains no reference to any sort of background image.. here is from my css file:
body {
background-image: url('http://localhost/site1/app/webroot/img/bg1.jpg');
font-family:'lucida grande',verdana,helvetica,arial,sans-serif;
font-size:90%;
}
I have tested that this works fine with a regular HTML file, I am hoping someone has an idea of what cake is up to that is giving me this problem.. thanks
EDIT: I have tested and I can display exactly the same image within a DIV (as its background) from the same css file.. something in Cakephp is overriding the body background-image setting, but I can't figure out what.
Place images in webroot/img
Place CSS in webroot/css
Write relative paths to references images in CSS styles:
background: url('../img/imagename.png');
You spelling for background is wrong:
ackground-image: url('/root/Desktop/bg1.jpg');
If that is not the case in your actual code, make sure that you are specifying the correct path, try adding a dot before /root/
background-image: url('./root/Desktop/bg1.jpg');
I've added a jpg file to the App_localResources folder and in the document properites specified the photo in the Background propery. In the designer it shows up as the background but when i run the page i still get the white page background.
There's no distinctly ASP.Net way of doing this.
The canonical HTML way is to include this CSS:
body { background-image: url('background.jpg'); }
If you defined the body tag with runat="server" you could add the style inline using the Attributes property, but this wouldn't be a good idea. Layout details like this should go in the Stylesheet.
Guessing that perhaps you have a stylesheet which might be overriding the background?
I would check if the built in web server was still running and stop it, then re-run your application.
* Right click on the tray icon and select "Stop".
The page is being cached, you should see your changes now.
I used fiddler to trace the calls on the image. App_LocalResources\*.jpg return an 403 error. The App_LocalResources folder is really for use for localization. If I move the image into an image folder it works fine.
Also rather than setting the Background property, use the Style property and the background property there.
Sometimes you need to clear the cache of the browser after making changes to backgrounds and colors in order for it to apply when you run the site the next time.
Take a look here:
http://www.wikihow.com/Clear-Your-Browser%27s-Cache