CSS - Embedding Flash Files In A Xhtml Strict Manner
I've been making ok progress with CSS (thanks to your help ) but have come up with a problem when wanting to embed a flash movie into my webpage. How do i do it using CSS?
the follwing Html code works fine but fails upon validation. Code: <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="300" height="300> <param name="movie" value="flash/home.swf"> <param name="quality" value="high"><param name="BGCOLOR" value="#A1D7FD"> <embed src="fighter.swf" width="250" height="250" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" bgcolor="#A1D7FD"></embed></object> Any help is appreciated. Also - is it a bad idea including small intro flash movies for webpages? any help is appreciated Similar TutorialsI usually build in XHTML Traditional, and modify via CSS... but i want to learn how to build in XHTML strict.. and practice i notice is putting data in ul lists... which when the css is taken off, gives quite a nice structured layout of text and such... problem is, i dont know how to do it to where the "dot" doesnt show up... anyhelp would be great. thanks So my page is valid strict xhtml 1.0, and valid css 2, yet it looks so messed up in FF. I can't figure out why. http://www.drowninginmytears.org/index.php It looks perfect in IE, but totally messed up in FF Can anyone help? Thanks. Is there an equivalent to the target attribute in XHTML strict for anchor tags? I have a web site using XHTML 1.0 Strict. The main body of the web pages is absolutely positioned 225px from the left, 100px from the top and is 750px wide. There is a banner and menu at the top and then another menu with links to the left. They are also absolutely positioned as well. I am using IE 6.0 as the main web browser since this is a corporate environment. The problem that I am having is that when I select text in the main body it either selects everything from the top down to the cursor or from the cursor to the end. I have troubleshot this and narrowed it down to the absolute positioning. It works fine in IE 7 with the absolute positioning. Does anyone know why this is happening and is there a work around for this? Thank you. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> Code: #content { position:absolute; width: 750px; left: 225px; top: 100px; z-index: 500; border-top-style: outset; border-right-style: outset; border-bottom-style: outset; border-left-style: outset; background-color: #ECE9E2; } quirks mode is what i'm using, but now im thinking that in order to support all browsers i need to jump to strict. now im really in trouble. is strict right for me? xhtml or html? my site works perfectly in firefox because that is what i have been testing it in, but it works horribly in IE. so, will switching to strict give me the best compatibility? Hi- I need to know if IE 5, IE 6 or IE7 are considered standards-compliant and do any of them support fully CS2 and strict standards? Thanks in advance- S I have a search box/button I want to keep on a single line in a tool bar on my page in strict XHTML/CSS. The <form> tag produces a line break beforehand. In old HTML I could put the <form> tag outside of the table row or data tags, but XHTML does not allow that (bad nesting). I found in devshed here to use style="display:inline;" which works! But the page does not validate as strict XHTML/CSS (using validator.w3.org). <table><tr><td> <!-- simplified to illustrate!! --> <form method="get" action="..." style="display:inline;"> <input type="text" name="q" size="10" maxlength="255" value="" /> <input type="submit" name="sa" value="go" /> </form> </td></tr></table> The Error and reason given is below. It seems that you can not have a block-level element (<input>) within in inline-level element (<form>). *** document type does not allow element "input" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", "address", "fieldset", "ins", "del" start-tag. The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element. One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>"). *** Does anyone know how to code this to not have the linebreak and still maintain strict XHTML/CSS code? Hi! How do I open a link in a new window in XHTML strict? (knowing that target="_blank" forbidden). Thank you Please look at this page http://www.tmhdesign3.com and this one http://www.tmhdesign3.com/real-estate-broker.asp The first one used a flash file, the second does not. On the first page I want the dropdown navigation to overlay on the flash but it does not. I played with z-index to no success... Is this a strict (or even valid) doctype? Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> what should I expect the UA to behave like? If i want to use the strict DTD, is there an alternative to the target attribute on the <a> link which you are no longer allowed to use? Hello guys, i've been trying for the past 2 days to google for textarea sizing under strict mode. i have found no solution and at the moment my problem is this... here is the code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "(URL address blocked: See forum rules)"> <html> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type"> <title>Untitled 1</title> <style type="text/css"> .style1 { text-align: center; width: 800px; } </style> </head> <body> <div class="style1" style="padding: 0px; margin: 10px auto 10px auto; background-color: #D6EBF5; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold; font-style: normal; color: #000000; width: 800px;">Little Bunny</div> <div class="style1" style="margin: 0px auto 0px auto; background-color: #D6EBF5; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold; font-style: normal; color: #000000;"> <div style="width: 400px; float: left; background-color:#EBEDF3; height: 100px; text-align: center; line-height: 100px;">Text</div> <div style="width: 400px; overflow:visible; float: left; background-color:#F2F9E8" id="OuterDiv"> <form method="post"> <textarea cols="0" id="T1" name="TextArea1" rows="3" style="float:left; width:100%; height:100px; margin: 5px; padding:0">efefefefefef</textarea> </form> </div> </div> </body> </html> The Textarea expend over the surrounding Div and it shows differntly under FireFox 3.5.7 and IE 8 (tested for both) I'm trying to do the following: make the textarea width 100% and height 100px for example. + padding 5px outside the textarea (space 5px from left, right, top, bottom).. most importent thing is to see it equaly under both ff and ie.. hope you can correct my code since i'm clueless.... have a nice day Hi folks, I am super excited about the box-sizing css rule. I've always thought the original IE box model was better and it was a shame that we had to ditch their superior model for the w3c one to be cross browser. Now all the browsers are starting to support box-sizing which will allow me to go back to the model I prefer. Unfortunately, pioneering the border-box sizing model, the only way I can get to it (that I know of) in IE6/7 is via quirksmode. Quirksmode has a whole bunch of other issues I don't want so this doesn't see a solution. I'm hoping someone out there will no how I can trigger box-sizing: border-box; in IE6/7 without quirksmode. If it's possible I'll be ditching the w3c box model in a hurry. Cheers, Pete Hi, I have a new template, and a new separate menu; the code has been validated on both. I'm having trouble adding the new menu to the new template, replacing the menu that came with the template. What I would like to do is embed it if possible so when I add content I won't have to change the menu on 400 different pages; also this is a nice menu with lots of code in the html. Is it possible to embed a menu from a root file with a small code? If not how do I add the huge code to my template? I have tried putting it on the top but the drop down doesn't work and parts of it are obscured by the content on my page. If I put the menu about half way down my page it works alright, but I need it on the top. (I tried to post the urls below but the forum rules prevent new members from doing so.) I know this is a lot of info, but I hope you can help me, if so I really appreciate it. Thanks, Dave I'm relatively ignorant about css and html, but I've faked my way along so far. But I've encountered a problem. I designed a style for a blog on LiveJournal, and it looks OK there. (http://www.livejournal.com/users/javajed/). I've also put a small bit of JavaScript in my website to embed my blog there. (http://www.jaredvoss.com/). On my website, the embedded blog is all screwy. All three DIVs should be contained within the scrolling layer, but only two of them are. Originally the sidebar DIV was even hidden behind the layer it's embedded in (I brought it forward using a z-index code). It seems like the sidebar DIV is taking it's position cues from the main body of my site, while the other DIVs are taking their position cues from the layer they're embedded in. I want all three DIVs to be aligned as they are on LiveJournal, and contained within the scrolling layer on my website. Any ideas? I've tried using wrapper divs and container divs (maybe not correctly) without success. Thanks for any help! I have a site that is designed to include a specific heading and footing on every page so that I can change my header and footer very easily. Problem is, my heading includes the entire <head> portion of the webpage, and doesn't end until it has already started the body. I am a bit old school and have my pages laid out as a table, which starts with my included header and ends with my included footer (the content goes into the "main" table cell opened by the header and closed by the footer). So, I guess I have a couple questions: - Is there any good way to embed page-specific style sheets given these constraints? - Do you think it is worth dividing up my header into two separate includes (e.g. 'header1.php and 'header2.php') so that I can customize the <head> section for each page? Hello, I'm brand new to this CSS business, so please be gentle! I'm trying to place my AP Div objects inside a table so that their positions are relative to the edges of the table, rather than relative to the edges of the browser window. I'm guessing I need to somehow put the code for the table around the code for the AP Div objects, but I can't work out how it's supposed to look. Any guidance would be much appreciated. Thanks! Hi, I wrote a code that would import some mysql data into my website. Now I want to format that data into a nice table. Table is probably the wrong term since I am trying to avoid HTML. Anyway I was wondering how you can embed CSS into a PHP script. here is my website: dicebaseball dot org The 4/27Bruins0Dragons0 is the data I am trying to make tabular Here is the code that I am trying to embed CSS into: Code: <?php mysql_connect("localhost", "....", "....") or die("Could not connect: " . mysql_error()); mysql_select_db("..."); $result = mysql_query("SELECT * FROM scores") or die(mysql_error()); $row = mysql_fetch_array( $result ); echo $row['game_date']; echo $row['away_team']; echo $row['away_score']; echo $row['home_team']; echo $row['home_score']; ?> I used this method because it seems like the most accessible and search-engine friendly. I run into a problem in IE6 and IE7 where the cursor does not turn into a pointer when the mouse is hovered over the image. HTML: Code: <h1 class="header"> <a href="#"><span></span>Header Text</a> </h1> CSS: Code: #header h1.header{ width:163px; height:37px; float:left; position:relative; } #header h1.header a{ float:left; display:block; width:163px; height:37px; } #header h1.header span{ background: url(../images/common/logo.gif) no-repeat; position: absolute; width: 163px; height: 37px; } I feel like there is one style declaration I'm missing, but I cannot figure it out. Issue resolved using forum search. Thanks for having such great resources - I just had to search for a while. |