I have a quick question which would really help me out, i'm sure it must be simple -- if its possible.
I am developing a wordpress website and using Chrome Inspects to edit the CSS, which i'm fine with. However, when I want edit the html code, I cant find the name of file i am editing on elements. Is there a way to find out the file name?
Hope that makes sense,
All the best,
Joe
Yes, it is on the top right corner of each css property.
Related
I know this question has been asked a ton. Yet I cant get mine to work after spending 2+ hours and downloading debugging software. I cant get my HTML file to link with CSS. One is a pic of HTML with the site I am trying to use. The other is my CSS. Sorry if this is actually an incredibly easy fix. I am student. Thanks for any help.
It seems like you're applying styles to your header element, which doesn't exist in the DOM. Please make sure the target is correct.
For a big site renovation project I am looking for a way to find all elements in a website to which a certain css rule applies. This site has been extended for 6+ years, so CSS rules are not systematic/logical at all.
For example: I want to know on which pages form input[type='text']{} is mentioned on the entire site.
I cannot do this with a simple 'find text' search, because there are a LOT of CSS rules that are specifically set to a certain element (e.g. #login form input{} or form textarea.forminput_small{}), so there probably is quite some overlap. Furthermore there are a LOT of pages, so I really don't want to do this manually.
My desired output would be:
input[type='text']{} is on: /index.html, /search.html, /contact/form.php etc
For me a solution like a browser plugin, external website tool or PHP script would be fine.
Hope someone has a nice solution for this problem!
Edit 9 August 2018: digging up an old thread. However, still not found a good solution, but I did find the element-finder plugin for Atom. Unfortunately, it doesn't work anymore. The GIF image in the description shows what the purpose of this plugin (i.e. my question) is. Any ideas for an alternative?
This question already has an answer here:
Closed 10 years ago.
Possible Duplicate:
Pinpointing the difference and changes made between two pages in magento 1.6.2
http://dokha.co/index.php/shisha-tobacco/al-fakher-shisha-tobacco-108.html
As you can see from the link above the product page is disorganized to some degree.
I have made some modifications below, in firebug, and took a screenshot. Can anyone advise on how to put these changes into effect?
You are trying to move up the "Select a Flavor" block?
Look at the source and delete the DOM node <div class="clearer"></div>. I use google Chrome browser because it is very easy to do things just like this. I right-clicked on Select a Flavor then selected Inspect Element. In the lower pane, I navigated up until the clearer block and deleted that.
To make the css changes to your page. Please create a custom.css file in the skin/frontend/yourfolder/css/custom.css and add the styles which you made in the browser.
Personally, I use Google Chrome browser to make changes to the page and then copy into the customised .css file.
It is always best practise not to replace in the default .css but use a customised version, so you have a version of the original file.
Hope it helps.
Cheers
How could I embed a Google Maps API Javascrip on my Flex Application?
I found some examples, but none of them worked for me.
http://javey.net/bike/map/player5/map.html?gpx=http://javey.net/bike/gpx/24-nov-2007.gpx&title=Sheldon.Road.Trail
Can anyone help me with that question? I would really appreciate it.
What have you tried so far? Do you have any code to show us?
Your second link explains using an HTML wrapper in Flex, which seems like a straightforward solution to me. You can make sure the HTML portion is working by opening it in a browser to make sure it shows up and displays properly (often this is the real problem).
The poster of the links you gave also linked to the source code in the comments: Flex + Google Maps. Try modifying a copy of their code to do what you want it to. Or cut out as much of their code as you can while preserving the functionality you want to see how they do it, and go from there.
I wonder if StageWebView is what you're after?
http://blogs.adobe.com/ria/2011/01/10/accessing-the-stagewebview-object/
Hello every one i had created a website using dreamweaver in windows7 which worked good in my system.I opened the same html site in another system with operating system windows xp and even in windows 7, but all the alignments of images ,textfields ,buttons and header image,content etc everything has been changed.what might be the problem.Can any one help me in solving this problem.Your answer will be most precious thing to me.Thanks to every one whose going to spend time on reading this question.
Without knowing more details it's hard to properly answer your question. Going to take a shot in the dark about a common issue.
If you did it in Dreamweaver you probably used its interface to drag and drop div elements around to place them in exactly the right positions. The problem with this method is that DW will use positioning relative to your screen size and it might not show up too well on other resolutions.
The solution to this is to make sure you code your containers correctly and not have a look at DW's CSS to fix it.
Without the HTML of your page (post it in pastebin and link it here), can't give a better answer.
Make sure you VALIDATE your code. In my experience using dreaweaver, the doctype declaration and the order of the tags can affect image positioning.
That was because you used different browser. In using Dreamweaver, try to not leave default values. For better debug you should code it with HTML and CSS. Those are not programming languages because they don't need exactly programming knownledge.
A really good HTML lessons at w3c.
A really good CSS lessons at w3c.