|
CSS - Valid Xhtml With Asp.net
I am developing websites using ASP.NET and C# for the code-behind.
I just started using css design and I realized after trying to validate my rendered pages that some things in ASP.NET would be VERY difficult to make completely valid. IE: ASP.NET automatically renders this piece of code everytime the page is rendered: Code:
<script language="javascript">
<!--
function __doPostBack(eventTarget, eventArgument) {
var theform;
if (window.navigator.appName.toLowerCase().indexOf("netscape") > -1) {
theform = document.forms["frm"];
}
else {
theform = document.frm;
}
theform.__EVENTTARGET.value = eventTarget.split("$").join(":");
theform.__EVENTARGUMENT.value = eventArgument;
theform.submit();
}
// -->
</script>
That right there is invalid due to the fact that it does not have type="text/javascript" in the <script>. There are many other instances of this that I won't go into detail. In order to fix this you have to override ASP.NET's page rendering methods and do a Regex! thats right, a regex on EACH line of code to replace the line above with valid XHTML. This can become VERY inefficient if you are serving 30+ pages a second. My question is this: at this point is it really worth the performance hit on my web server to make my asp.net sites XHTML compliant? on a side note, I would like to bludgeon the MS designer that wrote these chunks of code into ASP.NET!@!$%#$ thanks! Similar TutorialsSo 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. 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? if there is anyone who knows css really well and is willing to help me figure a few odds and ends up (the css is already made, just 2 problems), i will give you $2 paypal. I know it's not much, but I just need help with 2 problems. my aim is kutekyla if you are interested. Is there a place where one can find valid doctypes? I have been using the one below for a lot of my design: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> And it has recently come to my attention that this is not pointing to a correct .dtd file. When I do something like this: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> It drastically changes the layout of my page particularily areas where I have specified 100% height. Is there something I'm missing? Where does one find these correct doctypes? I'm using the max-width in IE in my site - specifically I'm using it to set the minimum height of certain elements. Now that it has become a key part of my design, I realized that it generates errors in the W3 validator. Does anyone know a valid way to use the min-height that will work with IE? Originally, I used <DIV> as containers for background images which swap when you hover over them. I enclosed the <DIV> tags with <A> tags to make them 'links'. Older versions of IE didn't want to work with this though and I found it this is invalid CSS, so I explored some more... The best solution I have found so far is to use <A> itself as a container. This solved the IE5 problems, but now IE4 SP2 doesn't show them at all. I'm okay with leaving IE4 behind, but I discovered that using <A> tags as containers was an invalid technique. If I can't use <A><DIV> and I can't use <A>, then what can I use to make valid, preloaded CSS image rollovers that work? I'm not considering Javascript an option. Is it possible? Here's a random, simliar example of what I've done with the <A> tags. http:// www. findmotive. com /2006/10/31/simple-css-image-rollover/ Hi all I'm working with Firefox and Firebug plugin. I want to check if the CSS I use is valid *the way browsers interpret it*. Example: Code: /* Valid: */
div.my {
position: relative;
z-index: 10;
}
/* Invalid: */
div.my {
z-index: 10; /* The attribute is not applied to the div, because it's not positioned! These sort of errors I want to get to know somehow! */
}
/* Valid: */
div.my {
z-index: 10; /* At this point the CSS isn't valid yet... */
}
div.my {
position: relative; /* Now it is valid (I guess, because I guess the browser first parses all CSS available and only after this it assigns the attributes?) */
}
I hope you see what I mean. I came upon this because I had some problems with z-indexes and then remembered that every z-positioned element needs to be positioned. If I had a cool Firefox plugin that would have checked the CSS every time before it were applied to the document and warned me this wouldn't have been a big problem. ;-) Thanks a lot for help Josh The following script has been validated and is working fine (not in IE/Win): body { margin-top:5px; margin-bottom:5px; padding:0; background:#ccffff; } a { text-decoration: none; } a:link { color: #0000ff; } a:visited { color: #33cc00; } t{line-height:36px;} #wrap { width:613px; left:50%; margin-left:-336px; background:#ffffff; margin-left:auto; margin-right:auto; } #sidebar { position:absolute; float:left; width:150px; border: 1px solid #000033; padding:15px; background:#ffffff; height:650px; z-index:1; } #main { float:right; width:390px; border: 1px solid #000033; overflow: auto; font-family: "Times New Roman", serif; font-size:13px; text-align:left; padding-top:20px; padding-right:20px; padding-bottom:20px; padding-left:20px; background:#ffffff; background-repeat:no-repeat; background-position:66% 540px; background-image:url(smalljester.jpg); height:750px; overflow:auto; z-index:2; } I'm still trying to figure out why it works. In particular, there are two margin-left tags in the #wrap div, one is -336 px and the other auto. I seem to remember this had to do with centering the layout (the negative margin) but how is it valid with two margin-left properties? TIA [I'd post the html from the dozen or so pages this is working on but there are too many urls.] This could be a tough one... I have trawled the search engines for a solution, but I don't think I'll find one. What I want to know is is it possible to create a dropdown navigation menu without using Javascript? I've seen an example of how it can be done with CSS, but the author said that it will not validate. Thanks in advance Andy Are there any? I am using the 'body:nth-of-type' hack at the moment and it is the one error when i validate my css. Any help much appreciated! I triedThis one aswell but again the css won't validate. I know there must be more i haven't tried but i was wondering if someone would be so kind and save me the effort of finding one that validates?? p.s. i am new at this... be kind!! I hope one of you can help, as this is driving me mad. I've got a div that I'm using to display a background colour that has a fixed width and height="100%" (I'm having a problem with the hieght as well but I'm confident I can sort that), as soon as I change the declaration at the top of the page from the HTML 4.01 Transitional to the XHTML 1.0 Transitional the div disappears, why? Cheers, Ellroy I'm having some serious difficulties... but not the standard, "what's wrong with my code", everything validates properly. Seperately... I really dislike linking outside of a forum to describe a situation... but in this scenario I think it is the only feasible way to explain it. The template that I have created for my website validates as, xhtml 1.1 -- tentatively as do all other documents that validate against the formal parsing. See the following to understand my situation. EDIT: Validation of my pages template in html format. - yay! it validates as XHTML 1.1 EDIT: Validation of my pages stylesheet - yay! it validates as CSS 2.0 EDIT: Validation of them both together returns the following: - Boooo! It won't validate and also tells me: Code: "Please, validate your XML document first! Line 2 Column 3 The markup declarations contained or pointed to by the document type declaration must be well-formed. " I would have thought that these things are dependent on eachother. Does it make sense that something can pass a XHTML compliant, but then be formed badly in such a way that a formal parser would read it wrong with respect to CSS? Is it because of my comments? If you look at the code of the page I have detailed a few things that I thought were important. Hello, I was just wondering how XHTML and CSS works within data-driven websites. I am new to developing database driven sites and need to develop one that uses XHTML and CSS formatting for content as this is what the company I work is aiming towards, due to web accessibility requirements. Does anybody know of any good books/resources that cover developing database driven (php/mysql) websites and implementing XHTML/CSS from within these sites. Would I be right to say that an area for the database content is created in the page which is written in XHTML? if this is correct does this area link to the CSS? Any help would be gratefully appreciated.... Thanks, Andy Hi, I want to validate my page to XHTML 1.1, but to do that I need to remove border="0" (Only used on two header images). I have tried putting border-style:none in my CSS in EVERY place I could think of, but it just doesn't work. My css is he http://www.planetphillip.com/style.css One other thing, when I remove the border="0" code, IE6 vertically re-aligns the header images. Would somebody be kind enough to explain why. BTW the site in question is: http://www.planetphillip.com/ TIA Phillip I am building a new navigation menu which works fine as you can see below: http://www.hotlinkhosting.com/test/menu.php However, the following version does not: http://www.hotlinkhosting.com/test/menu.php?. The difference between the two is that the first one doesn't have a doctype set. The second version has a xhtml doctype. All my documents are written in xhtml so it must be done. I see that the problem occurs with my resizing of the <h1> and <h2> tags with css. After resizing the space the heading tags normaly take up is still their. Feel free to take a look at the source code and I hope you can help. Btw, I know the nav menu doesn't look right in ie, but that isn't my fault now is it? I can't help it ie can't read code correctly. Anyways After I get the menu working with "real" browsers I'll fix the ie errors. I've seen several examples of how to emulate frames using CSS, but I haven't seen anywhere explain how to create "frames" without having to add the entire frame code to every page in which it appears. With frames, I used to be able to create a menu which would appear throughout my site. I would modify the one, single menu.html file, and the changes would be visible throughout the site. How can I do this using the CSS-emulated frames? Thanks I had to redo my page because none of it was validating through w3c so I'm trying it again and attempting to get my css right however the widths of my divs correct to match my psd. Any thoughts on what I'm doing wrong? PSD jpg kansasoutlawwrestling.com/wrestling2.jpg Site kansasoutlawwrestling.com I'm new to css and have been impressed with the way you can make style changes to a whole site by just altering one stylesheet (if you've set if up right). My question is, can css or xhtml be used to do that with content? I want to create a site with a Nav column floated on the left hand side of every page, but I'm worried I'd have to change hundreds of pages if i ever added/altered the column. Is there any way I can get every page to pull a table/other-xhmtl from one source, maybe by putting something in the stylesheet? Thanks. I am new to xhtml and am working on my web page i want to use a graphic to split my different areas and the book i was using only showed how to put in a plain line, In .css PHP Code: h2 {border-top:1px solid #4D65A0} I have found a graphic i want to use from the animation factory cd's i have and now im lost as to how to put it in. new line: slash_blue_mw.gif sorry posted in the wrong spot b4 Hi All. I've had a problem with a website for the last few days, i've done the design, and the html side is no problem in a table layout, but i'm trying to get it working using DIVS and pure CSS. I'm attaching an image of the layout. URL Look at the image, i want the design, aligned center and vertically in the middle. Here is a key to each section. Yellow, Text would be in this section. Red, Bar that goes the width of the screen. Green, The Menu, Home | About etc etc etc (the red bar is actually the menu bar but only used for a menu where the green is) Blue, This is an image, that over laps the menu bar. White, this is just where the copyright notice goes. If anyone could knock up a quick template i'd be extremely grateful, that is ofcourse if a layout like that is possible with DIVS etc. Thanks people. |
|||||||