HTML - Help Make Css/html Compatible?
Hi
my html and css that i have coded is only valid in opera and does not run as it is meant to in firefox and safari. Can anyone help me fix it. The text input box is what is broken. here is the html: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <meta name="author" content="Husain Abdullah Al - Zabir" /> <title>WebSnips</title> <link rel="stylesheet" type="text/css" href="styles/main.css" media="all" /> <link rel="stylesheet" type="text/css" href="styles/rounded_corner.css" media="all" /> <link rel="stylesheet" type="text/css" href="styles/bottom_menu.css" media="all" /> </head> <body> <center> <div class="box"> <b class="tc"> <b class="L1"></b> <b class="L2"></b> <b class="L3"></b> </b> <div class="content"> <div class="box" style="width:100%;"> <b class="tc"> <b class="L1"></b> <b class="L2" style="background-color:#333333;"></b> <b class="L3" style="background-color:#333333;"></b> </b> <div class="content" style="background-color:#333333;"> <div style="width:630px; padding-top:10px;"> <div style="float:left; background-image:url(images/http.jpg); background-position:center; background-repeat:no-repeat; width:95px; height:40px;"> </div> <div style="float:left;"> <input style="height:28px; border:none; font-family:verdana; font-size:21px; color:#7d7d7d; padding-top:6px; padding-bottom:6px;" type="text" size="35" /> </div> <div style="float:left;"> <input type="image" value="submit" src="images/submit-button.jpg" /> </div> </div> <div style="clear:both; height:30px;"> </div> </div> <b class="bc"> <b class="L3"></b> <b class="L2"></b> <b class="L1"></b> </b> </div> </center> </body> </html> here is the css: Code: #logo { width: 317px; height: 40px; /*background-image: url(../images/logo.gif);*/ background-image: url(../images/logo.jpg); background-position: center; background-repeat: no-repeat; } #logo-holder { padding: 20px; } #footer-logo { width: 609px; height: 40px; /*background-image: url(../images/footer-logo.gif);*/ background-image: url(../images/footer-logo.jpg); background-position: center; background-repeat: no-repeat; } #footer-logo-holder { padding: 5px; } #instruction { border-left:solid 4px #98CB00; padding-left:5px; font-family:verdana; font-size:17px; font-weight: normal; color:white; text-align:left; width:623px; } #instruction-holder { padding-top: 20px; padding-bottom: 20px; } .separator { width:10px; background-image: url(../images/separator.jpg); background-position: bottom; background-repeat: no-repeat; float: left; height:180px; } .urls { font-family: verdana; font-size: 12px; color: #7d7d7d; height:180px; font-weight: bold; line-height: 20px; width:203px; clear:both; padding-top: 20px; } .snips_name { font-family: verdana; font-size: 21px; color: #FFFFFF; text-align: left; } #top_snips { width:31px; height:38px; background-image: url(../images/top_snips.jpg); background-position: top; background-repeat: no-repeat; margin-right: 5px; float: left; } #latest_snips { width:38px; height:38px; background-image: url(../images/latest_snips.jpg); background-position: center; background-repeat: no-repeat; margin-right: 5px; float: left; } #partners { width:53px; height:38px; background-image: url(../images/partners.jpg); background-position: top; background-repeat: no-repeat; margin-right: 5px; float: left; } Can anyone help fix this? Thanks Similar Tutorialsplease help me guys!!! im trying to find a html code that allows people download a pdf files from the website that im trying to make..anyone out there help me.. site works great in Safari, looks fine in Firefox, but the header and footer don't show in Internet Explorer! Any suggestions? Here is the website: www.czechcpa.com hi please check my site www.yourdesign.org and please could somebody tell me how i can stop it going all weird in IE, it looks fine in firefox cheers guys n gals Hello, I am trying to write a piece of HTML for my web page. It is used to display a blog on a web page but in a frame, the only problem is that at the moment it only works in IE. Could someone help me make this universal or working in FF as well? HTML Code: <HTML> <HEAD> <TITLE>ZenBanners</TITLE> </HEAD> <FRAMESET> <FRAME src="http://ZenBanners.BlogSpot.com/"> </FRAMESET> </HTML> refer to new post Hi there. So I don't need it for 800x600, only the sizes over 1024x768. Basically I made this template which I need to be able to be re-sized when in your browser. I thought I did this right, however I forgot about other resolutions other than 1024x768. When in higher res, the tables break a little and from what I can make out just get a little larger. What I can't work out is how to make them all work properly most large resolutions? Link to the template is he http://www.ruthlessintent.com/penguins/ Hi i was wondering if anyone can help me with making my page compatible with older browsers IE7+. My page is www.marksbodyshop.org The css is: Code: html,body { height:100%; margin:0; background-color:#000; background-image:url(../images/firstpage.gif), url(../images/firstpage-backup-for-safari.gif); /* required by Safari */ background-size:100% 100%; } #container { height:73%; background-image:url(../images/update.png); background-size:100% 100%; } #nav { position:absolute; padding:0; margin:0; list-style-type:none; height:7%; width:57%; top:20%; left:20%; z-index:1; } #nav li { width:16%; margin:1%; height:100%; } #nav a { display:block; width:100%; height:100%; outline:none; text-indent:-9999px; background-size:100% 300%; } #about {background-image:url(../images/aboutus.png);} #about1 {background-image:url(../images/contactus.png);} #about2 {background-image:url(../images/freelunch.png);} #about3 {background-image:url(../images/map.png);} #about4 {background-image:url(../images/meettheteambutton.png);} #nav a:hover {background-position:0 -100%;} #nav a:active {background-position:0 -200%;} sorry im really new at this stuff. so i have the code, and i need to make & view the page.. so how do i do that?? thanks I need to have this text in html. I need only the text, no table. My problem was, that when i changed the fontsize, a new paragraph was created. But i want it on one line. Thanks for your help. is there a better way than this (below) to style Script and Code, to look like script and code when written/typed in html? For instance how does the [ HTML ] [ /HTML ] in this forum work? HTML Code: <style type="text/css"> .csslook { font-family: "Courier New", Courier, monospace; font-size: 12px;} .darkpink {color:#990099;} .green {color:#006600;} .pink {color:#FF00FF;} .darkblue {color:#000099;} .blue {color:#0000FF;} </style> <div class="csslook"> <span class="darkpink"><style type=<span class="green">"text/css"</span>></span><br> <span class="pink">#mainContent {</span><br> <span class="darkblue">padding</span><span class="pink">:<span class="blue">0px 1px 0px 1px</span>;</span><br> <span class="darkblue">border-width</span><span class="pink">:<span class="blue">1px 2px 2px 1px</span>;</span><br> <span class="darkblue">border-style</span><span class="pink">:<span class="blue">solid</span>;</span><br> <span class="darkblue">background</span><span class="pink">:<span class="blue">#faf6f6</span>;</span><br> <span class="darkblue">color</span><span class="pink">:<span class="blue">#000</span>;</span><br> <span class="darkblue">border-color</span><span class="pink">:<span class="blue">#edd #baa #baa #eed</span>;</span><br> <span class="darkblue">font-family</span><span class="pink">:<span class="blue">Arial, Helvetica, sans-serif</span>;</span><br> <span class="darkblue">size</span><span class="pink">:<span class="blue">12px</span>;}</span></span><br> <span class="darkblue"></div></span> </div> Hi all, I'm having a little trouble here, I'm a newbie at coding but I'm learning. how would I achieve something like this? http://www.createblog.com/layouts/code.php?id=28757 and or like this? http://www.createblog.com/layouts/code.php?id=28038 should I be using divs...as you can see in my code I went div crazy...I kinda perfer divs anyway! how can I do this? HTML Code: <style type="text/css"> a:link {color: #66cdaa; font-family: verdana; font-size: 6pt; text-transform: uppercase; text-decoration: none;} a:visited {color: #cc6600; font-family: verdana; font-size: 6pt; background:#FFFFFF; text-transform: uppercase; text-decoration: none;} a:hover {color: #870708; font-family: verdana; font-size: 6pt; background:#FFFFFF; text-transform: lowercase; cursor:hand;} /*all links above*/ body {background-color: black;} color: #ffffff; font-weight:bold; font-family: arial; font-size: 12px; margin: 0px auto; padding: 0px; text-align: justify; scrollbar-face-color:#1ee849; scrollbar-shadow-color:#1ee849; scrollbar-3dlight-color:#1ee849; scrollbar-arrow-color:#000000; scrollbar-track-color:#1ee849; scrollbar-darkshadow-color:#1e scrollbar-highlight-color:#1ee849;} h1{color:#66cdaa; font-size: 20px; letter-spacing: -1px; text-align: left; font-family: arial; margin: 10px 0px 0px 0px; line-height: 15px;} h2{color:#66cdaa; font-size: 15px; letter-spacing: -1px; text-align: left; font-family: arial; margin: 10px 0px 0px 0px;} p { font-weight: bold; color:#66cdaa ; font-family:times ; font-size: 12px; } /*all divs here*/ div { font-weight: normal; color:#66cdaa ; font-family: times; font-size: 12px; } div#header { clear: both; height: 50%; width: 100%; background-color: ; padding: 1px; } div#master { float: center; width: 100%; background-color:white; } div#left { float: left; width: 150px; background-color: black; } div#right { float: right; width: 150px; background-color:black; } div#middle { padding: 0px 160px 5px 160px; margin: 0px; background-color:black; } div#footer { clear: both; background-color:grey; } </style> <title>I like my nails</title> </head> <!--who ha --> <body> <div id="Head"><img src="pic location" width="100%" height="50%" alt="pic name " /> </div> <br /> <br /> <div id="master"> <div id="left"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus justo, luctus vel, pretium quis, semper id, metus. Duis quis turpis id sapien hendrerit aliquam. Duis nisl. Sed fermentum magna ac velit. Integer tincidunt arcu ac elit. Fusce urna pede, dapibus id, mollis eu, tempor eget, nunc. Integer eros quam, scelerisque sagittis, ultricies non, pellentesque id, elit. Nam accumsan fermentum massa. Suspendisse vehicula ultricies nisi. Curabitur tempus bibendum mi. Donec eu lectus vitae dolor accumsan auctor. Cras quis dolor sed ipsum tristique pulvinar. Nam id quam vitae lectus tempor faucibus. Aliquam id nisi ut nisl semper blandit. Morbi pellentesque congue lacus. Sed sed metus. Quisque libero mi, malesuada ut, tincidunt et, fringilla ut, erat. Sed accumsan gravida dui. Donec enim turpis, mattis eget, adipiscing dictum, </div> <div id= "right"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus justo, luctus vel, pretium quis, semper id, metus. Duis quis turpis id sapien hendrerit aliquam. Duis nisl. Sed fermentum magna ac velit. Integer tincidunt arcu ac elit. Fusce urna pede, dapibus id, mollis eu, tempor eget, nunc. Integer eros quam, scelerisque sagittis, ultricies non, pellentesque id, elit. Nam accumsan fermentum massa. Suspendisse vehicula ultricies nisi. Curabitur tempus bibendum mi. Donec eu lectus vitae dolor accumsan auctor. Cras quis dolor sed ipsum tristique pulvinar. Nam id quam vitae lectus tempor faucibus. Aliquam id nisi ut nisl semper blandit. Morbi pellentesque congue lacus. Sed sed metus. Quisque libero mi, malesuada ut, tincidunt et, fringilla ut, erat. Sed accumsan gravida dui. Donec enim turpis, mattis eget, adipiscing dictum, </div> <div id="middle"> <h1>Your Header Here</h1> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus justo, luctus vel, pretium quis, semper id, metus. Duis quis turpis id sapien hendrerit aliquam. Duis nisl. Sed fermentum magna ac velit. Integer tincidunt arcu ac elit. Fusce urna pede, dapibus id, mollis eu, tempor eget, nunc. Integer eros quam, scelerisque sagittis, ultricies non, pellentesque id, elit. Nam accumsan fermentum massa. Suspendisse vehicula ultricies nisi. Curabitur tempus bibendum mi. Donec eu lectus vitae dolor accumsan auctor. Cras quis dolor sed ipsum tristique pulvinar. Nam id quam vitae lectus tempor faucibus. Aliquam id nisi ut nisl semper blandit. Morbi pellentesque congue lacus. Sed sed metus. Quisque libero mi, malesuada ut, tincidunt et, fringilla ut, erat. Sed accumsan gravida dui. Donec enim turpis, mattis eget, adipiscing dictum, vestibulum id, nulla. Etiam consectetuer. Duis varius sem eu nisi. Praesent congue aliquam elit. Sed nec sapien. Curabitur lacinia, augue et hendrerit pharetra, sem magna lobortis quam, ac volutpat magna nisl vel libero. Duis magna. Vestibulum suscipit dui id magna. Suspendisse potenti. Etiam ut purus. Praesent tincidunt, elit bibendum eleifend tincidunt, arcu lacus vestibulum magna, et pellentesque est justo fringilla dui. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur elit. Mauris dignissim gravida massa. Vivamus eu odio. Proin euismod aliquet erat. In sed justo. Nulla a dolor ac tortor placerat elementum. Donec nisi. Donec lobortis. Cras ut augue. Donec enim. Aenean ut ligula ac arcu suscipit consectetuer. Duis nibh dui, mollis et, elementum ac, luctus eu, diam. Quisque risus nunc, pharetra in, commodo vel, vestibulum in, tellus. Praesent blandit sagittis nisi. In hac habitasse platea dictumst. Morbi interdum. Nullam tincidunt enim eu mauris. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut pretium, justo at pharetra suscipit, lorem nulla sodales dui, at ultrices quam tellus sit amet metus. Pellentesque consequat vestibulum sem. Cras consectetuer ipsum non augue. Praesent tellus nulla, sodales at, pretium ut, consectetuer vel, massa. Aenean risus orci, suscipit eget, ornare eget, lacinia sit amet, sem. Ut vulputate, metus quis posuere gravida, massa nisi commodo tellus, viverra cursus massa leo at purus. Morbi feugiat fermentum lectus. Aliquam blandit placerat velit. Aliquam vestibulum porta elit. In erat. Etiam non augue. Aenean luctus. Fusce arcu mauris, vehicula quis, ultrices sed, porta nec, dolor. Donec eros tellus, posuere nec, vehicula ut, venenatis at, diam. Curabitur hendrerit. Nulla enim enim, sodales nec, imperdiet ac, gravida vel, dolor. Etiam hendrerit, leo a mollis semper, elit metus tincidunt pede, sit amet porta turpis quam at diam. Proin sagittis nulla luctus elit. Curabitur non sapien. Proin eget orci. Curabitur tortor mauris, faucibus a, euismod fermentum, congue eget, nisi. Sed et purus. Curabitur eget quam et massa dignissim tristique. Cras elit. </div> </div> <div id="footer"><strong>Copy right 2008 Syd</strong> | Design by <strong>Syd</strong></div> <!--end of the stuff--> </body> </html> /sorry for all the mistakes, I'm not a native English speaker/ I know it may sound sill or wierd for some of you but I'm completly new in html and all those things but I have to do a project in information technology - a website about me. I have to split it into two frames. I did sth like this: <frameset> <frame name="A" src="menu.html"> <frame name="B" src="homepage.html"> </frameset> The thing is - it looks really awful. Look: http://tinypic.pl/i/00001/xmbmjwgb6amg.png Can i delete somehow this horrible line between the frames? I would like to put an image as a backgraund and it won't look good if there's a wide grey line splitting it. Help! Hi Newbie question: I want my html file, when accessed directly from the browser, to open a different web-page (which is a php script that calls my html file when it's done). But if my html file was reffered to from that page, it's ok - open it. How can I achieve this? Thanks Joe Hi all, Is it possible to make iPod application in HTML/XML. If it is possible then how can I make an iPod application using HTML/XML. With Regards, I have a list of names in say a data base flat file, Do you know if there is a utility that will take and read per line and generate a html file? Hav'nt found anything as of yet but am wondering if someone could steer me in the right direction. thanks yes i was wondering if there is a way that i could make my program when the new option is selected from the drop down menu automatically make a new folder in a certain folder on my computer. is there any way to do that. 1St PROBLEM OF PASSWORD HIDING HAS BEEN SOLVED,N DA 2ND PROBLEM HAS BEEN GIVEN IN THE LAST POST OF MINE. PLEASE CHECK @ALL N HELP ME. Hey friends,i'm having a JavaScript by which we can make our html page password protected. I got dis script from a site n tried,but dont know where i'm going wrong. CAN U ALL PLZ TRY IT N DEN SAY ME,HOW N WHAT TO DO. The script is as follows,which is to b placed in the head tag. Ok.. <script language="JavaScript"> <!--hide script supplied by hypergurl http://www.hypergurl.com var password; var pass1="daksh"; password=prompt('Enter your password in order to view this page!',' '); if (password==pass1) alert('Correct password, OK to enter!'); else { window.location="http://soamz.uk.to"; } // end hide--> </script> Plz help me.. My temporary site is http://soamz.uk.to Hi people, I've search the net regarding this issue and from what I've gathered, images can only be transparent provided it's in the gif format. May I know is it possible to make png pictures transparent? I heard that's possible with IE 7, but I want a method that works with lowers versions of IE too. I'm trying to avoid CSS if possible, is there a code something like "style=transparent" that can be typed into the <img> tag? Thanks Hey guys, I'm new to HTML... Well not completely new, I know the basics like how to bold stuff, how to make a new paragraph, line-breakers, all that easy stuff. Now I have a project to do by the end of this summer... I'm expected to make a site where people can Rent Toys online (dont ask ) . So I have to be able to have Paypal Access in my site. Now I need a bit of help... I started reading a couple of tutorials on this site and I'm trying my best to understand them. My question is, where do I start writing or developing my site? I can't just put it on Microsoft Word, there has to be a web page developing server or site I can use.... Any recommendations? I can pay whatever the cost is; After all in the end (if I finish everything) my reward is breath-taking... If there is a specific web developing company or server that deals with Paypal, or online purchasing, that would be helpful information to know as well. Thanks guys! That's all the questions I have for now |