|
CSS - Trouble Applying Css To Iframe
Hi ,
I have writen an advertising script that basicly lists my text link advertisers , this works everywhere on my site except for on my portal page where i have to use an iframe to insert the content instead of an include. the links come up fine however they are the default blue / purple not the colours defined in the style sheet I tried to make a few changes to the style sheet and iframe however nothing seemed to work , so I am hopign somoen can tell me where i am goin wrong first lets start with the example list of links all located on a page called New3.html Code: <a href="this is a test"> test.com</a> <a href="this is a test"> test.com</a> <a href="this is a test"> test.com</a> <a href="this is a test"> test.com</a> <a href="this is a test"> test.com</a> The page with the iframe is called New2.html and contains the following Code: <html>
<head>
<style type="text/css">
<!--
#main_iframe a:link{
color:purple;
}
#main_iframea:visited{
color:red;
}
#main_iframe a:hover {
color:black;
}
#main_iframe a:active{
color: green;
}
-->
</style>
<title></title>
</head>
<body>
<iframe id="main_iframe" name="main_iframe" src="New3.html" frameborder="0" scrolling="NO">
</iframe>
</body>
</html>
what I basicly want is for the css in the page New2.html to effect the links that are imported from New3.html unfortunately it's not as easy as just putting the css into New3.html though because the css file used will depends on the skin of the users cms The logic with my above examplkes is that I tried to set the iframe with the id or main_iframe and then i tried to set the link variables for that id , but as you can see it didn't work thankyou so much in advance to anyone that can help Fallen Angel Similar TutorialsThe CSS in this file:
Code: <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head> <title>Comments on 2005-02-09: February 9, 2005 - Final Game</title> <meta http-equiv="Content-Type" content="application/xhtml+xml; encoding=UTF-8;" /> <link rel="stylesheet" type="text/css" href="comments.css" /> </head> <body> <h2>Posting on 2005-02-09: February 9, 2005 - Final Game in <a href="refresh.php" id="title">XMLBlog</a></h2> <div class="entry"> <p class="normal">I woke up like usual. <em class="entry">My mom couldn't find my lunch bag, so I had to show her.</em></p> <p class="happy">On the way to school, I nearly fell asleep on the bus. <em class="entry">Surprisingly, I felt more rested than before.</em></p> <p class="normal">We had a sub in Physics, along with homework. <span class="happy"><em class="entry">While doing my homework, I talked to this guy that sits nearby.</em></span></p> <p class="happy"><span class="sad">At the beginning of class, I tried to switch with someone to sit near a friend, but our sensei didn't allow it.</span> We just did reading in Japanese, <em class="entry">where I was better than a majority of the class as far as Katakana is concerned</em>. Also, we looked at pizza menus and added up our cost in <ruby><rb>円</rb><rt>エン</rt></ruby>. <em class="entry">some of them looked so delicious, which made me hungry.</em></p> <p class="normal">We watched a video in health, and nothing else.</p> <p class="happy">I basically had English off, since I already finished all of my work. <em class="entry">I also found out that my pre-write can count as a rough draft, since I didn't really do one. Along with that, I get to turn in my completed vocabulary in a day late, since I proved to her that I had it done.</em> For the most part, I just read while listening to music.</p> <p class="sad">Lunch alone, again.</p> <p class="normal">Math was comprised mainly of continuing work on our investigations. <em class="entry">This one didn't have proofs, which made it easier.</em> Due to our teacher talking about homework, we didn't move onto the next one.</p> <p class="normal">We started off with playing our warm-ups for Solo & Ensemble, then went to free time. <em class="entry">For the most part, I goofed off.</em> <span class="hider">Also, someone was trying to lift a stand up, but the top flew off and hit them in the chin, hard.</span></p> <p class="sad">Once home, I found that the euphonium I was waiting for didn't arrive yet.</p> <p class="normal">I had a normal trombone lesson this time. <em class="entry">I made somewhat considerable progress, and was taught better hand positions.</em></p> <p class="happy"><strong class="entry">The euphonium came!</strong> It took a while, but it finally arrived. <em class="entry">The nice <strong class="entry">Bach 5GS</strong> my mom bought was too small, since we thought the instrument would be a small-shank. Still, the instrument came with a 6 1/2 AL from Jupiter, which I shall use for the time being.</em></p> <p class="happy">Later on, I found out that there was a 5GS there. <em class="entry">Earlier, I had called Mills about it, and they eventually replied saying there was one.</em> My dad and I went there and bought it.</p> <div class="story"> <div class="title">Final Game (Bothell Lost N/A)</div> <div class="storybody"> <p class="normal">After a quick lyre readjustment for my new euphonium, my dad and I dashed off to the school...</p> <h>Enter: Eighth Graders</h> <p class="normal">When I got there, I found out how <em class="entry">huge</em> the band was. <em class="entry">There even was another baritone player from my old school!</em> My section commented on how good my instrument looked. <em class="entry">When we warmed up, he also commented on the great tone it had.</em></p> <p class="normal"><span class="sad">We had trouble cramming into the stands, so we had to cover a full section and around 1/3 of another.</span> Throughout the entire game, I told the eighth grader some things to remember, and cracked a few jokes with him.</p> <p class="normal">When the game actually started, we got into our final setup. <span class="sad"><em class="entry">I was near someone that annoyed me.</em></span> <em class="entry">Also, I talked to the 'leader' of the trumpets a bit, as well.</em> The game for our team was going decently. </p> <p class="sad">The guy in front of me got more annoying. He also hit my section where it hurts most. <em class="entry">I kind of got back at him when he snuck my cell phone away from me.</em> Still, he cracked jokes no matter what. <span class="normal"><em class="entry">Also, the group thrusts were a little messy, but decent to say the least. It <strong class="entry">may</strong> be that the eighth graders haven't gotten used to them yet.</em></normal></p> <p class="normal">At half-time, the little girls danced up with the cheerleaders. <em class="entry">Someone made an insightful comment about how their parents paid them to be sluts.</em> <span class="happy"><em class="entry">Also, the trumpet leader danced and sang with them, and a few of us joined in.</em></span> Of course, we played a few songs. The percussion played, and we did our thing.</p> <p class="happy">Rest came with the third quarter. <span class="sad">Though, when I went to buy drinks, they only had <strong class="entry">Powerade</strong>, which was <em class="entry">okay</em></span> Once back in the stands, I shared the candy I bought with a couple of friends while we chatted. Also, I performed the <strong class="entry">Baritone Test</strong> on the eighth grader's instrument, which proved it as a euphonium. <em class="entry">Though, it still seems too light and small to be a real euphonium. It's the same brand as mine, but a lower-end model.</em></p> <p class="normal"><span class="sad">Our team was losing badly.</span> Still, we kept up our little spirit through it all. It all ended as usual.</p> <p class="happy">My section and I talked on the way back from our last game as sophomores. Also, we played us some <strong class="entry">Oompa</strong>!</p> </div> </div> <p class="normal">After the game, I wondered if there was a Denny's party. My dad and I checked twice, most likely finding it as false; so I went home.</p> </div><p>No comments</p><hr /><form action="postcomments.php?ie=&title=February 9, 2005 - Final Game&date=2005-02-09" method="post" name="comment" id="main"> <div class="right"> <img src="comments_files/right_main_bar.png" alt="right_side" /> </div> <div class="left"> <img src="comments_files/left_main_bar.png" alt="left_side" /> </div> <div class="center"> Date: <input type="textarea" class="upper" name="date" value="2005-02-09" readonly="readonly" /> Title: <input type="textarea" class="upper" name="title" value="February 9, 2005 - Final Game" readonly="readonly" /> <br /> Name: <input type="textarea" name="name" class="lower" /> E-mail: <input type="textarea" name="e-mail" class="lower" /> </div> <div class="comment"> <input type="textarea" name="comment" class="text" /> <input type="submit" value="Post!" class="click" /> </div> </form> </body> </html> Applied this as a div id and a div class, neither of which apply css to the links and text properly. Also hashed all selectors. Some of these are to be followed by regular text/explanations. What am I missing here? Code: .cont { /*container*/
position: relative;
background: #FBFBFB;
float:left;
border: 1px solid #D3D3D3;
width: 195px;
color:#999;
text-decoration: none;
}
#vt-r {
color:#999999;
text-decoration: none;
font-size: 0.90em;
font-weight: 400;
margin: 10px 0px 7px 15px;
}
.vt-r:link {
color:#3366CC;
text-decoration: none !important;
font-size: 0.70em;
font-weight: 400;
padding: 15px 5px 0 0;
margin: 10px 0px 7px 15px;
}
.vt-r:hover {
color:#333;
text-decoration: underline;
}
<div class="cont">
<div id="vt-r">
<a href="/urladdress.htm">LINK1</a><br>
Example text.<br>
<a href="/urladdress.htm">LINK2</a><br>
<a href="/urladdress.htm">LINK3</a><br>
</div>
</div>
Greetings Not sure about the best way to go about this. I have an Unordered List that has a set height for the List Items. Like so: Code:
#left ul {
padding: 0px;
list-style-type: none;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#left ul li {
text-align: center;
float: left;
margin-right: 20px;
height: 200px;
margin-bottom: 20px;
}
This works fine for most of the pages, but there is one where I really need the height of the <li>'s to be 350px. I tried just adding a class like Code:
.comics {
height: 350px;
}
I tried adding this to the <li> Code:
<li class="comics"><a href="#"><img src="images/comics/thumbnails/HeldvsHeldin3_sm.jpg" alt="" width="250" height="350">
</a></li>
and also just a <span> Code:
<li><span class="comics"><a href="#"><img src="images/comics/thumbnails/HeldvsHeldin3_sm.jpg" alt="" width="250" height="350">
</a></span></li>
but it still kept the 200px height. Do I need to make a whole new <li> code or am I missing something? hey guys i have this so far
Code: div#navbar2 {
height: 30px;
width: 100%;
border-top: solid #000 1px;
border-bottom: solid #000 1px;
background-color: #99b3b4;
text-align:center;
}
div#navbar2 ul {
margin: 0px;
padding: 0px;
font-family: Arial, Helvetica, sans-serif;
font-size: small;
color: #FFF;
line-height: 30px;
white-space: nowrap;
}
div#navbar2 li {
list-style-type: none;
display: inline;
}
div#navbar2 li a {
text-decoration: none;
padding: 7px 10px;
color: #FFF;
}
div#navbar2 li a:link {
color: #FFF:
}
div#navbar2 li a:hover {
font-weight: bold;
color: #000000;
background-color: #e4ebeb;
}
but what i can figure out is how to show the link they are on as a selected button so having the button be red if they are on that link... Code: <div id="navbar2"> <ul> <li><a href="index.php?page=update">Basic</a></li> <li><a href="link2.html%20">Button 2</a></li> <li><a href="link3.html%20">Button 3</a></li> </ul> </div> This is killing me! The border of a DIV top is working perfectly on FF but not applying on top in IE 6+7. Here are the class attributes: {padding:1px 7px 3px; font-size:16px; border-color:#555555; border-style:solid; border-width:1px 1px 0px; text-decoration:none; color:#425366; background-color: #abd3ff; font-weight:bold;} Not sure if the problem is on this class or in anything that affecting it. Any suggestions will be great. Ehud How do I apply margins to the outside of all of my frames? Just the outside, treating my frames together as one page and adding blank space to the outside of that page rather than adding margins to each frame separately. Sidebar div's background is messed up. Its background should be black until the end, but its cut short. Check it he http://www.refinethetaste.com/html/default.asp?Section=products&CATEGORYID=4 PHP Code: #products .sidebar { background: #000000; color: #CCCCCC; padding: 10px 0 0 0; } #products .sidebar ul { margin: 0; padding: 0; list-style: none;} #products .sidebar li { display: block; float: left; width: 124px; padding: 10px 5px 10px 15px;} #products .sidebar li ul { line-height: 15px; } #products .sidebar li li { display: list-item; background: url(../images/img07.gif) no-repeat left 50%; padding: 0 0 0 10px;} #products .sidebar h2 { font-size: 12px; margin: 0px; color: #FFFFFF;} #products .sidebar a { font-size: 10px; text-decoration: none; color: #CCCCCC;} #products .sidebar a:hover { text-decoration: underline;} #products .clear { clear:both; height:1px; width:1px; overflow:hidden; } PHP Code: <div class="clear"></div> <div class="sidebar"> <ul> <li> <h2>Lorem Ipsum</h2> <ul> <li><a href="#">Fusce dui neque fringilla</a></li> <li><a href="#">Eget tempor eget nonummy</a></li> <li><a href="#">Magna lacus bibendum mauris</a></li> <li><a href="#">Nec metus sed donec</a></li> <li><a href="#">Magna lacus bibendum mauris</a></li> </ul> </li> <li> <h2>Recipient</h2> <ul> <li><a href="#">Family</a></li> <li><a href="#">For Him</a></li> <li><a href="#">For Her</a></li> </ul> </li> <li> <h2>Price</h2> <ul> <li><a href="#">Under $50</a></li> <li><a href="#">$50-$75</a></li> <li><a href="#">$75-$150</a></li> <li><a href="#">$150 & Up</a></li> </ul> </li> </ul> </div> <div class="clear"></div> This is a bit puzzling for me. I read that I can apply css to something based on id, which I have been doing, thats how my template is made, USING CSS :S. I need to apply css to an H2 that already has css applied to it but has a different id. Here is the page I need to do it to, view it and see why I need to. http://www.coldfusionzone.com/index.php?p=7 Look down towards where the comments are and youll see Leave a comment I need to change that to where it expands up to 40 pixels from the side, and has a black background without the stinkin date pic next to is . Now that Im talking about it im confused again. Ha ha I had it down pat but now that I need help im confused thats strange. But I need to apply a css style to it when it already has a css it.... Here the css style that controls it is on top and the css style im trying to use is on the bottom. PHP Code: div#content h2 { background: #000 url(images/date.jpg) no-repeat left center; background-color: #232323; color: #5F5F5F; padding: 2px 15px 2px 85px; border: 1px solid #494949; margin-left: 40px; margin-right: 220px; margin-bottom: 10px; margin-top: 0; font-size: 95%; font-weight: normal; } div#content#postcomment h2 { background: #000; background-color: #000000; color: #5F5F5F; padding: 2px 15px 2px 85px; border: 1px solid #494949; margin-left: 40px; margin-right: 220px; margin-bottom: 10px; margin-top: 0; font-size: 95%; font-weight: normal; } i have a table that i'm using within a div. here is the style #content { float: left; padding: 0 20em 4em 3em; } #content table .content { border: 1; bordercolor: #fff; width: 100%; cellspacing: 0; cellpadding: 0; } when i reference the style for the table within the div, nothing is applying. not sure what im doing wrong here. <div id="content"> <table class="content"> please advise.. i'm guessing its syntax Please can anyone tell me why my style sheet is not applying to this page http://www.on-line-biz.com ? How to define a style so that I can just put <table class="abc"> and it will apply to both table, th, td together? currently i am using: table,th,td{ //style here } it work in all table, th, td. But i just sometimes want to write <table class="abc"> and it would apply in all cell within this table. so that I don't need to write <th class="abc"> , <td class="abc"> in every tag in same table. thx. I have a few styles that I was to apply to anything that has a class="title". These work fine when I say, for example: Code: <div class="title">This is my title</div> but, for some reason, they don't work when I use them like so: Code: <table border="0" cellspacing="0" cellpadding="5" class="maintable">
<tr>
<td>
<div class="title">News Updates:</div>
</td>
</tr>
</table>
Can anyone explain to me why this is? If so, how should I go about getting around it? I have a css stylesheet and an xslt stylesheet. In my xml doc i apply the xslt stylesheet, but how do i also apply the css? thanks can it be done? ideally in IE5-6 and Netscape6+ cheers I have a link such as this <div id="columns"> <a href="whatever.htm">Whatever</a> </div> For reasons I won't go into here, I cannot change the div. And that div contains: #columns a:link { color: #0000C0; text-decoration: none; font-weight: bold; } #columns a:visited { color: #000080; text-decoration: none; font-weight: bold; } #columns a:hover { color: #FF0000; text-decoration: underline; font-weight: bold; } The above is fixed, non-changeable. What I want to do is change the color of the link, even thought I cannot change the div or the CSS code above. I tried: <a href="whatever.htm" class="colorchange">Whatever</a> where colorchange is: .colorchange { color: red } Nope. Doesn't work. I'd like to put some kind of class in the middle of the <a tag that will have some effect on the appearance of the link, but the above doesn't work. Any ideas what I can do, given that I can only change the <a link and not the <div> or the CSS? Thanks ...Vidya www.webwisesage.com IE5 doesn't support this (trying to apply padding-left to links). Has anyone found a good workaround - Don't really want to put each one inside a DIV hey i have applied a style to a select tag which should be displaying a red border... but it doesn't work....however THIS WORKS IN OPERA 7 but doesn't work in IE and Mozilla :S go to the site and click submit straight away...as you can see there is no border applied to the second drop down box! does anyone no how to apply a border to a select tag site is located at http://studentwork.qantm.com.au/pking/website/feedback.cfm cheers This is where I always run into trouble. I don't know if I'm taking from the right approach but this is what I usually do and I always end up getting frustrated and taking it out of those poor IE users and just removing IE fixes completely. I usually tackle completely design a site using Firefox and then apply patches as I get around to it ( a round tuit ), but sometimes, a fix will cause other errors and it just ends up in a domino effect until my IE CSS file is bigger than my Firefox CSS and there are still problems. How should I go about this? Should I go to the ghetto with $100 and go around shooting IE users .... or better yet IE development decision makers....? I found the solution to my IE browser issues. There seems to be a new guide out there with a lot of great comments about it. The last guide I followed had a bunch of people asking for help. Hope this works. I would like to create an effect similar to the one found on http://www.macromedia.com that when you click in the search box, the edge of the searchbox changes color. I know how to change the color of the box, but I do not know how to make the box switch whenever it is clicked on or in focus. Can anyone help me? |
|||||||