I'm currently programmatically adding a stylesheet to my content page using VB:
Dim link As New HtmlLink()
link.Attributes.Add("rel", "stylesheet")
link.Attributes.Add("type", "text/css")
link.Href = "Styles/AddNewModelStyles.css"
Me.Page.Header.Controls.Add(link)
At first glance, this seems to be working as my web page is formatted properly. However, I added new styling to the stylesheet and nothing happened. I completely removed all styling from the stylesheet, refreshed the page, and nothing changed. It seems to me like the original stylesheet is being cached, but I can't figure out how to clear the cache. I've tried F5, Shift+F5, closing browser and opening new, all to no avail. Anyone have any ideas why this is happening?
Internet Explorer Go inside your browsers tools and select -> Internet Options -> General -> Browsing History -> Settings -> View Files
Select all of them and delete them and reopen your browser.
Google Chrome Ctrl+Shift+Del -> Select from the beginning of time in the drop down -> Clear Browsing Data
I was able to figure out the solution to my problem by using Inspect element to find where the stylesheets were being loaded in. When you programmatically add a stylesheet to a content page, the stylesheet link gets added to the master web page head tag, not the content page head tag. My stylesheet was ultimately in the wrong directory (the stylesheet directory of the content page, NOT of the master page), and moving it to the master page's directory solved the issue.
Related
im using wordpress and want to add a link which open in a frame/lightbox. Cant find a small solution for that.
There should be no new window. Just a content box which appear inside the page where i am. I hope u know what i mean
That should be pretty easy using the Easy Fancybox plugin.
Citing the entry from the FAQ section of the plugin's page:
Can I display web pages or HTML files in a FancyBox overlay?
Yes. First, enable the iFrame option on Settings > Media. Then, in your post or page content create a link to any web page or .htm(l) file in your content. Then switch to the Text tab in the Classic Editor or to Edit as HTML (under More options in the block menu) in Gutenberg, find the link <a ... > tag and give it a class="fancybox-iframe" attribute.
Voilà !
Beware, though, that:
Note: Not all external web pages are allowed to be embedded in an iframe and may be blocked by a server response header or script. The result will be either an empty/blank light box or the target page “breaking out” of the light box and loading in the main browser tab.
And you'd probably face the same problem with any other iframe solution. So that would work better with locally served pages.
I am using the same style sheet for 2 pages (index.html & contact.html). All styling has been applied to index.html. Now I have copied and pasted the same code into contact.html, but have found that the new CSS styling I have tried to use will not apply to this page. The pathfile to the style.css sheet has not been changed. What I don't understand is why some of the styling is being applied from the other page but when trying to add new styling it does not?
Have you tried clearing your browser cache or going incognito/private browsing
Are you applying new styles using classes or ids? Id is unique, while classes are reusable. Also if you have inline styling it will override the stylesheet. Can you post your code as an example?
Well there can be a couple of reasons for this:
Make sure that your stylesheet is properly loading. I don't know if you are using in page styling or an external stylesheet but make sure that it actually exists there.
How can you do that? When you open the contact.html page in the browser, hit Ctrl + U if you are using windows or Command + U if you are using Mac. If it is an internal styling, you will be able to see the actual code there. If you are using an external stylesheet make sure that the <link> tag exists in the page. If it exists the right click on it and select Open file in a new tab. If you see can see the code in the next tab. It means that your styles are properly loading.
Make sure that your elements in the html page and stylesheet file have the same appropriate names. For example # of id's and . for classes.
If everything is okay then it can be a cache issue. Since browsers cache the static assets, you should consider refreshing the cache by Hard Reloading the page. How can you do that? It's simple, just hit Ctrl + Shift + R if you are using windows or Command + Shift + R if you are using Mac. If these keys don't work, just click and hold the reload button on the browser until it shows a dropdown. Then simply select Hard Reload.
In case it doesn't work, then send us a link to your webpage. I'm here to help you. Just let me now :-)
I am creating a new asp.net web application.
Application contains a default master page i.e site.master.
That Master page has link to site .css that was the by default css attached.
link href="~/Styles/Site.css" rel="stylesheet" type="text/css"
I removed site.css from my project(exclude from project) but its functionality survive. How this is happening? Why the styles gets not deleted or removed??
I am Using IE11.
Exclude from Project is not good way to do this.
Remove that file completely then you will not have that file loaded.
after that remove reference from master page or anywhere you are giving it.
Do CTRL + SHIFT+ F for entire solution search and search for that file name. so remove that references if you find.
now about browser cache issue. remove browser cookies and history. Or you have one more option like open your website and load with b y pressing
CTRL + F5. it will load your website totally fresh and with new code completely.
I have index.html and guide.html, I link to the guide.html in the index page. however when i go to the guide one through the link the page won't have the design until I refresh. What am I doint wrong? Each page has its own css.
Here's an image right after I click:
And here's another one right after I refresh:
Could be cached css/html. If it looks right after pressing ctrl+F5 on the page in question, it is working correctly.
Web browsers cache CSS files. I see you're using Chrome for Windows - CTRL + F5 will fully refresh the page, CSS and all.
If this problem appears on a live site for some reason, you could re-name your CSS file to avoid the browser using a cached version. For instance custom.css would become custom-2.css.
I am having an issue with IE (9 in this case) where I have uploaded a new CSS file for a page and it works just fine when I go to the page. The problem I am having is when I browse to any another page, if I then hit the back button it renders my page using a previous version of the CSS file. I verified this using the F12 tool to see that the css file only had the entries from the previous version. In this case, i was styling 'ol' and 'li' elements if that matters.
Is there anything I can do to make IE load the most current version of a css file when the browsers back button is used?
Again, the page loads perfectly if I browse to it in any "forward" manner, I also have my browser set to check for new versions every visit. Its when I hit the back button it has problems. Also every other browser ive tested has no problem using the back button.
you could add a parameter when calling the stylsheet...
?version=2
...after you .css extension
If you are clicking back to return to a page that you have previously visited with the old stylesheet, then yes, it will load the old stylesheet. A simple refresh should fix this.
The reason is that the back button is not meant to reload old pages, but to preserve the pages exact state and return the user back to that page.
If indeed you have loaded the new stylesheet on page A and then move forward to page B, then click back to go to page A and an old version of the style has been loaded, there might be something going seriously wrong with IE's cache. It might be a bug. Maybe changing the filename or adding something to the query string will force it to recognise your stylesheet as a newer version eg:
style.css?v2
will make sure the browser treats your style as a completely new file and disregard any old cached versions.