css sheets in each frame - html

I working on a very old website that I am trying to update and I seem to be running into some issues.
My biggest problem seems that it seems that the same style sheets need to be included in each frame instead of placing them in the header frame and effecting the whole page.
Is there any way around this? I have some bootstrap I wanted to include and don't really want to declare those a billion times.

CSS cannot be applied across frames, I believe.
Main thing is, frames are depreciated. First thing you need to do is remove them. However, given it's an old site you just want to update, removing might not be an option.

Related

Change the height propriety on a live website?

I am trying to use the built in inspector tool in Google Chrome to manipulate the site http://www.di.se (as it probably has one of the most # layouts I have ever seen on a popular website) with around 300 000 visitors daily.
It seems to be mainly built with three HTML frame tags with the names: historyFrame, headerFrame and contentFrame. I can remove the headerFrame that covers a huge part of the view. However, I don't know how to change the contentFrame size so that it will cover the entire screen.
I have tried to add a CSS height property but it does not seem to change anything. If this is solvable I would be very thankful and so would 300000 other users :) Thanks!
The frameset, which is the parent of the frame you removed, specifies the heights for each of the frames, currently rows="0,210,*". So if you remove the header frame, the content frame becomes the second frame and gets a height of 210. By changing this attribute to 0,* the problem should be fixed.
However I'm not able to modify this property in Chrome's toolkit. Maybe this is a limitation of the developer tools of Chrome. After all, frames are old (removed even from HTML5), so maybe they didn't pay much attention to supporting it.
Note though that the top frame contains the advertising that probably pays for the site. If you got this working and all 300.000 users would use your solution, then the site would probably seize to exist, and you got 300.000 unhappy users. So think twice before you do this.
You can do it by:
First deleting the first Frame(header)
and modify this:
from:
rows=".260,*"
To:
rows="1,*"
So you have only the frame you want, no useless data and the frame you want take 100% of the screen.

Is there any way to snapshot entire website to detect changes caused by CSS change?

I'm maintaining a website where a recent CSS change intended to solve a problem on one page inadvertently caused a problem on another page. I know there are ways to take a snapshot of a single webpage (and by snapshot, I mean get an image of how it looks to the end-user). Is there any way to quickly and easily grab snapshots of every page on a website, so I can make a before-and-after comparison?

How to make Wordpress child theme independent of parent CSS?

I created a child theme based on the responsive i-transform theme http://templatesnext.org/itrans/, but in the end it feels like I'm spending a lot of time undoing the i-transform CSS. However, if I dequeue the entire parent stylesheet, things get out of whack because I used the default parent wrapper here, a div there, etc. While it runs fine with the parent stylesheet, it's very sloppy and I'm sure it slows down the page some to have all these layers of overridden CSS.
If I had the time, I could go through the 4000+ lines of the parent stylesheet and copy out what I need. But I'd rather not. Is there some way to get a clean copy of only the css that my pages use... the css that "wins" and is really being displayed, if that makes sense?
You can't, or at least not like you mean. You're trying to both create a new stylesheetand still want to use some of the code from the original stylesheet (the default wrapper you mention above). You can't completely ignore (i.e. delete) the original stylesheet and still use part of it.
If you still want to use part of the original stylesheet in your new one, just copy and paste the pertinent bits across.

Different layout display on website over multiple loads

I am having an extremely odd issue creating a template for my zencart ecommerce website.
I find that many times I load the website my menu will break up and split over two lines as shown below.
The reason I find this behavior odd is that if I refresh the page it correctly displays.
Now I could understand how to fix this if it was consistently one way or the other but it seems to vary between the two with no obvious difference in the code... I am not sure if this is some sort of technical bug with chrome as I haven't been able to replicate it in other browsers however even if it is I really need a way of working around it. So I am curious as to whether anyone has had this issue before and if so how they got around it.
Link to live site: http://digitalmatrixonline.com.au/
Thanks Jason
If you add
white-space:nowrap;
To the div that contains the list it should prevent this, not sure why it's happening though.
Edit: here is a jsfiddle showing the technique http://jsfiddle.net/RM4S2/
Edit: No floats http://jsfiddle.net/BsGfu/2/
This is a really strange problem, and I was able to recreate the quirkiness in Chrome. While I don't know the direct cause of the issue, I think I found one way that works.
If you set the width of the second div within 'navEZpagesTop' that you are floating right that is wrapping,to 'width:485px;'. This seems to give the section room and does not wrap. If you want to leave more room for this expand without modifying the css you could set it to a much larger size, and float all the links inside of this to the right(instead of the left).

is it possible to place an element over flash that has wmode=window in chrome?

I'm working on a page that has some ads on it. One of them loads in an ad with wmode=window. I don't have the ability to change that flash code. I need to put a modal box on top of that flash element, but every combination of using z-indexes and iframe shims has failed (both manually and using bgiframe). Is there a way to place html content on top of a flash element with wmode=window? I'm testing this in chrome so far... figuring if I can't at least get it to work there, it won't work anywhere.
I'm afraid there is no way around it.
WMODE-window forces the browser to render the element on the very top layer, and it will overlap everything.
Rob
Yes it is possible, i had done this before using php and Css, your right though i did use the index "z" properties in my CSS Sheets than i had used php divs to what your trying to do, i maned to get 3 transparent flash Movies on top of each other , it was a pain for me and not much documents on this at the time,
trial and error is your best go, i had deleted my old web server i had used this method for, if you get desperate i will have a look through backup drives, but it is possible so dont give up