CSS - Multiple Php Scripts Using Css
Is it possible to use CSS to "call" multiple PHP scripts and display them on one page?
I want to display several different RSS feeds on a page. I have tried using plain tables, but I get an error: "Cannot redeclare startelement() (previously declared........." I put the script in a table he http://rottweilerconnection.com/test1.php This is the RSS feed (script) without the table: http://rottweilerconnection.com/test11.php And here is the script itself http://rottweilerconnection.com/test11.zip Similar TutorialsHello! I'm gonna try to keep this as simple as I can, I don't know css at all... I have a site where I'm gonna feature trailers in Quicktime and I'm planning on using a script called clearbox to open these trailers. Go to my site and view the trailers to see what clearbox is. Now, to my problem. I'm gonna have 20 trailers per page, but all the trailers are not the same size. If you check out the trailers on my site you can see that the close button for the Pirates 2 trailer is a bit off, as to the National Treasure trailer where the button is where it's supposed to be. That's because the trailers are in different sizes, and the boxes/windows also are in different sizes. To change the position of the close button, I have to edit the clearbox.css file. What I'm getting at is that I must have one clearbox.css file for each trailer/window and that every clearbox.css file needs an id or something so I can call it from within the html/php file. Here's the code for clearbox as I have right now on my site. First up is the code I have within the head section... Code: <link href="piratesofthecaribbean2/css_trailer/clearbox.css" rel="stylesheet" type="text/css" /> <script src="piratesofthecaribbean2/js/clearbox.js" type="text/javascript"></script> <link href="nationaltreasure/css_trailer/clearbox.css" rel="stylesheet" type="text/css" /> <script src="nationaltreasure/js/clearbox.js" type="text/javascript"></script> And here are the links for the "View trailer"-buttons... Code: <a href="piratesofthecaribbean2/trailer.php" rel="clearbox(668,,330,,click)"><img border="0" src="http://www.jbfans.com/images/linkfilms_viewtrailer-normal.jpg" class="domroll http://www.jbfans.com/images/linkfilms_viewtrailer-hover.jpg" width="124" height="27"></a> Code: <a href="nationaltreasure/trailer.php" rel="clearbox(668,,342,,click)"><img border="0" src="http://www.jbfans.com/images/linkfilms_viewtrailer-normal.jpg" class="domroll http://www.jbfans.com/images/linkfilms_viewtrailer-hover.jpg" width="124" height="27"></a> Clearly, this setting doesn't work. What I wanna know is if I can have multiple clearbox.css files with different settings (to suit each trailer/window) and if I can call these clearbox.css files in this link: Code: <a href="nationaltreasure/trailer.php" rel="clearbox(668,,342,,click)"><img border="0" src="http://www.jbfans.com/images/linkfilms_viewtrailer-normal.jpg" class="domroll http://www.jbfans.com/images/linkfilms_viewtrailer-hover.jpg" width="124" height="27"></a> I hope someone understands what I want, I really want this to work! Thanks in advance! I would like to have multiple id and all using hover link for all #test1, #test2, #test3, #test4 a:hover{ color:#0F0; } this doesn't work. NOT sure why?? thanks does anyone know of a good, non-outdated method for installing and /or using both IE6 and IE7 on one machine (windows xp)? right now I have IE6 installed because it is the most different from FF3 (my true love), but I can't test sites on IE7. and I know (well, assume) that if I just install IE7, I can't switch back. I know that there have been a few posts on this in the past but none seem to specifically cover what I am after. I am currently creating a CMS for a few sites that I run. Now don't get me wrong this is nothing flashy, it's just a personal project, however, when designing pages I can get everything to display in FF, Opera and IE perfectly well, however, as I add new elementes to the page things seem to get a little.. out of place. My pages always display perfectly well in FF and Opera, however, IE 6 & IE 7 usually have small problems to do with margins and such, nothing life changing but I am very critical of my own work. My question is whether or not I should create seperate style sheets for IE6 & IE7 that overwrite certain bits of the CSS that IE doesnt like and replace it with code that works well in IE, whilst hiding it from other browsers. I would also be interested if people have other suggestions with regard to this as I am always up for learning new skills and ways of doing things. Thanks for reading! Regards, Matt. Hello, I am creating a message to display on my web sites. The HTML markup is as follows: <div class="Error"> <h3> <img id="Icon" src="Images/Error_Icon.gif" alt="Icon" style="border-width: 0px;"> <span>Header</span> </h3> <p>Description</p> </div> And the CSS: div.Error { background-color: #FFD9D9; border: solid 1px #FF9595; padding: 0.4em; position: relative; min-height: 1.25em; width: 120px; } div.Error h3 {} div.Error h3 img {vertical-align: middle;} div.Error h3 span {color: #B30000; font: bold 1.0em Georgia, Geneva, sans-serif;} div.Error p {color: #B30000; font: normal 0.8em Arial, Geneva, sans-serif; I have 3 types of messages: Warning, Error and Success. The only difference between the CSS of each message is the colors properties. Should I use a class named Message to define all common properties and then 3 other classes: Error, Warning and success to define the color properties: <div class="Message Error"> Or should I use three different classes? How is this usually done? Any other advice on how I am building my message is welcome to. Thanks, Miguel Based on CSS, on a static XHTML-written site, can multiple languages be used? And can they be user-switchable? Thanks, Chris I have encountered a really annoying bug in IE6 and would be very interested to know if anyone else hase encountered it and found a solution. Look at the following example: PHP Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css" media="screen"> .class1,.class2,.class3 { border: 1px solid black; width:400px; line-height: 100px; text-align: center; } .class1 { background: none; } .class2 { background: red; } .class3 { background: blue; } .class1.class2.class3 { background: black; } </style> </head> <body> <div class="class1">Test Content 1</div> <div class="class2">Test Content 2</div> <div class="class3">Test Content 3</div> <div class="class1 class2 class3">Test Content 4</div> </body> </html> The four divs should all be different colours as follows: div1: transparent/white div2: red div3: blue div4: black However, both divs 3 & 4 are black. The rule: .class1.class2.class3 { background: black; } is incorrectly effecting divs with only .class3. Any ideas? Ok. So after some one i don't know on a website i was reading told me i should replace my tables with CSS i decided to listen to them. Now the website's top bar should look like this: http://www.leeksoftware.co.uk And i decided to do each box as a DIV. BUT! I can't get them all in a line. I can get the yellow one to the right of the long one but then i cant get the rest in the line. So far the CSS is: Code: div.logo { height: 70px; width: 618px; background-color: #476cD9; float: left; } div.home { height: 70px; width: 100px; background-color: #E29942; margin-left: 619px; float: left; } div.soft { height: 70px; width: 100px; background-color: #CC3333; margin-left: 719px; } div.tuto { height: 70px; width: 100px; background-color: #006666; margin-left: 819px; } div.cont { height: 70px; width: 100px; background-color: #254D78; margin-left: 919px; } I tired adding float left to all of them but that made them go diagonal. Can any one help? Thanks Matt Hi, i need to delvelop something like "SomeName X". Currently i am doing with DIV(1 DIV for 'SomeName' and 1 DIV for 'X' and finally float-left to another DIV). Since these names(like "Somename1 X",'Somename2 X"...) are populated in the div container, when it reaches the right end of the container, "X" alone getting wrapped to the next line. But it has to be along with 'SomeName' always. As other forums says, I tried with table but it didn't work since the final div container is fixed and i get multiple names with variant length. I tried clear:both, float left - it too didn't work. I have seen like the one in facebook - compose page. I would like to know how to implement this. Any help appreciated. Thanks in advance. Hi all, I have several CSS files to look after different browsers, but I use javascript to match the IE css with IE browsers, etc. Can you only have one CSS file that looks after ALL browsers? So that if the user doesn't have javascript it's not a problem? I've heard of css hacks and css filters being used but I'm not all that familiar. Ben Hi, I'm trying to use multiple classes: div class="class1 class2". As usual, IE 6 does all but not what you would expect. Please allow me to post a code snippet: Code: <html> <head> <style type="text/css"> .class1 { background-color: red; } .class2 { background-color: green; } .class1.class2 { background-color: yellow; } </style> </head> <body> <div class="class1"> .class1 -- should be red </div> <div class="class1 class2"> .class1.class2 -- should be yellow </div> <div class="class2"> .class2 -- should be green </div> </body> </html> Sadly, the rule for .class1.class2 is also applied to the third div, where it should clearly NOT apply, so it is yellow instead of green. I know that using subclasses "is not safe for IE", as is CSS in general -- but is there a workaround that doesn't force me to abandon the technique? Thank you, answers appreciated! this code inherits properly in FF, but not in IE. any workarounds? Code: .red { background:red; } .yellow { background:yellow; } .red.yellow { background:purple; } Code: <table border=1> <tr class="red"><td>red</td></tr> <tr class="yellow"><td>yellow</td></tr> <tr class="red yellow"><td>red yellow</td></tr> </table> I'm having a little problem with centering divs: I have a dynamic page that displays items. Each item has it's own div containing an image and a title. I want these divs to be centered but also to drop onto multiple lines if necessary, for example: There is room for 4 items per row within the container div, so one item would be centered, two items would be centered, and so on, but 5 items would have 4 divs on the top row and one div centered underneath: 1 item: [div] 2 items: [div][div] 4 items: [div][div][div][div] 5 items: [div][div][div][div] [div] 10 items: [div][div][div][div] [div][div][div][div] [div][div] and so on. I can get this to work by using float to automatically drop the next 4 onto the next row, but is there a 'center' attribute or technique I could use to keeps these divs centered? I hope this makes sense to you all!! Am tryin to use multiple external style sheets in the same html..is it possible??..if it is..how do i use it? Is it possible to have multiple link classes? Currently, I'm using the pseudo elements a:link, a:visited, etc., but there are a couple of places in my layout where the colors for these links are the same color as my background. Is there any way that I can single out certain links using classes and set their colors to a different color like #ffffff Thank you in advance, Jim Yep, there's another multiple column problem! I'v created this website to give an example of my problem. As you can see, the #left and #content seem to ignore the border of the #navigator and slip right over it. This problem appears only in IE, in Mozilla there's no problem at all! What is happening? Here's the CSS stylesheet I'm using: body { text-align: center; } a { font-size:12px; text-decoration:none; font-weight:600; font-family:verdana; } a:link {color:#FF0741;} a:visited {color:BDD131;} a:hover {color:white;} #container { margin-left: auto; margin-right: auto; text-align: left; width: 90%; margin: 10px auto; font-family:verdana; font-size:12px; background-color: #EEF3C9; color: #FF0741; line-height: 130%; } #Header { padding: 0; background-color: #EEF3C9; border-style:solid; border-color:#BDD131; border-width:1px 0px; } #navigation { border-style:solid; border-color:#FFFFFF; border-width:3px 0px; text-align:right; font-size:20px; background-color:#BDD131; margin:0; padding:0; } #navigation li { display:inline; padding:20px; margin:0; } #navigation li a:hover { color:white; } #Left { float: left; width: 200px; height: 400px; margin:0px; background-color:#BDD131; } #Content { width: 550px; background-color:#EEF3C9; margin-left: 210px; margin-top:10px; padding: 40px 0px 0px 40px; } #End { clear: left; margin: 0; padding: .5em; color: #FF0741; border-style:solid; border-color:#FFFFFF; border-width:3px 0px; background-color: #BDD131; } I'm trying to set up multiple link style schemes , but it works in IE, not in Firefox? In Firefox in a.link does same as a.intro:link. What do I do, what's wrong? a:link { color: #006600; text-decoration: underline; font-weight: bold; } a:visited { color: #006600; text-decoration: underline; font-weight: bold; } a:hover { color: #FFFFFF; background-color: #66CC00; } a.intro:link { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #FFFFFF; background-color: #000000; } a.intro:visited { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #FFFFFF; background-color: #000000; } a.intro:hover { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #FFFFFF; background-color: #8DCB2E; } hi all, I am trying to figure out how to have multiple CSS Rollover images with links on one page. Any ideas, tips, suggestions or samples are greatly appreciated! Brook How do I make multiple tabs in CSS? I want tabs with rounded corners. So far I can only get 1 tab. What do I do to make more? |