CSS - Same Code, Same Css, Different Result???
Greetings,
I don't know how is this possible. Please, take a look at these 2 pages: Correct: http://83.208.191.102/bio/Sources/M...t.modified.html Screwed: http://83.208.191.102/bio/Sources/M...modified02.html It's no browser-specific problem, it does the same in both IE and FF .I must be missing something really basic, but I can't see any difference Similar Tutorialshi everybody i made that topic in green bcz i love real betis im kind of new here it is a good forum really i have a problem that makes me crazy at fact 2 problems but i dont want to be rude lol so i will post 1 problem and sometime else i will post another one my problem is that i make a css page that i call style.css but even if i put the right code like that => PHP Code: <html dir = "rtl"> <head> <title>programming forums</title> <link rel = "stylesheet" type = "text/css" href = "style.css" /> </head> <body> <p id="center">programming3 the best forums ever</p> </body> </html> but when i try this code i dont get what i want im i wrong in something guys ok im waiting for ur gifts :d i mean suggestions cyo lateeeeeer[/color] Hi all, I need my data to display like the states on this page: http://www.designfirms.org/directory/Internet_Design/Web_Design How do I achieve this using css and no tables? Can anyone help? I am using php/mysl to generate the data and this is the current code to pull the info: <table border="0" cellpadding="3" cellspacing="0" width="100%" id="table1"> <tr valign="top"> <td> PHP Code: <? $sql = "SELECT * FROM db"; $execute = MYSQL_QUERY($sql); $numrows = MYSQL_NUMROWS($execute); $counter = 0; $increment = 1; // Loop throuch all the categories with parent id = 0 for ($i=0; $i <$numrows; $i++) { $rs = MYSQL_FETCH_ARRAY($execute); $counter = $counter + $increment; $category_name = $rs["cname"]; $category_url2 = str_replace(' ', '-', $category_name); $category_url = strtolower($category_url2); //echo $counter; if ($counter == 4) { // close the last row and start a new row $counter = 1; echo "</td><td>"; ?> <span class="med">> <a href="/directory/<?=$category_url?>.html"><?=$category_name?></a><br></span> <? } else { ?> <span class="med">> <a href="/directory/<?=$category_url?>.html"><?=$category_name?></a><br></span> <? // end of the if counter statement } ?> <? // end of the for loop } ?> </tr> </table> The NEW results would need to display in the <div id="center"></div> area. Any help would be much appreciated. Hello; Could anyone tell me how to addjust my result to the top(10% away from the top)? please. I try to use margin-top:10%, but it does not work. Please go to my website http://www.businessfind101.com/ and type the sentence with "MySql YourSql" into search function, you will see the result in the button, i have not idea to move them up. and my code as following; Code: php session_start(); $aString=$_REQUEST["SText"]; $_SESSION["aString"]=$aString; ?> <!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" xml:lang="en" lang="en"> </head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style type="text/css"> table.display{margin-top:10%} </style> <body> <?php $con = mysql_connect("localhost", "#*$!","1#*$!"); if (! $con) { die('Could not connect: ' . mysql_error()); } mysql_select_db("#*$!x", $con); $result = mysql_query("select * from Customer2"); // was it a success if (!$result) die ("Error processing request - check your query"); // process results $nrecs = mysql_num_rows($result); /* Use tab and newline as tokenizing characters as well */ $tok = strtok($aString, " "); while ($tok!== false) { $len=strlen($tok); $len=$len/2+1; $tok=substr($tok,0,$len); $b="tu"; $myresult=mysql_query("SELECT * FROM Customer2 WHERE MATCH (Topic,Des) AGAINST ('$tok*' IN BOOLEAN MODE);"); while($row=mysql_fetch_array($myresult)){ echo "<br>"; echo "<br>"; echo " "; $Cid=$row['Cid']; echo " "; $row['Count']=$row['Count']+1; $Count=$row['Count']; mysql_query("update Customer2 set Count='$Count' where Cid='$Cid'"); } $tok = strtok(" "); } $result = mysql_query("select * from Customer2"); echo "<table border=0 width=50% class='display' bgcolor='ccffff'>"; //i will display result on the screen while ($row=mysql_fetch_array($result)){ if($row['Count'] >0){ echo "<tr><td>"; echo $row['Des']; echo "</td><td>"; echo $row['Count']; echo "</td> </tr>"; } } $f=0; mysql_query("update Customer2 set Count='$f'"); echo "</table>"; mysql_close($con); ?> </body> </html> 1st off, how much do I have to worry about NN4 being used by web surfers? Wondering if I need to always be aware and adapt my pages to it. 2ndly, and most important, can someone help me with HOW to fix the below code. Have added the hack for IE mac/IE 5.x windows. But it screws up in IE6 by making the div extend to the right browser edge. How do I get it back in IE6? (Do I need to mention works fine in Firefox? ) **I have had to question my possible rudeness of posting the exact code in the book I am using for some CSS learning, along with mentioning the book by name. Thus, have stripped the code down to what's really important and deleted references to before said book. ** Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd"> <html> <head> <title>Dude</title> <style type="text/css" media="all"> body {background: rgb(75%,66%,66%); margin: 0; padding: 0; font: 12px/1.5 Verdana, Arial, sans-serif;} div#wrap {border: 2px solid black; background: white; position: absolute; margin: 0 80px 0 0; padding: 0 0 2em 0; left: 80px; right: 80px; top: 40px; voice-family: "\"}\""; voice-family:inherit; right: 0;} div#wrap img.curve {float: left; clear: left; margin: 0 15px 0 0; padding: 0; height: 20px;} </style> </head> <body> <div id="wrap"> <p>This div should be 80px from the right. After using hack for IE mac & IE 5.x win, <strong>IE6</strong> now stretches div all the way to the right. How do I make the hacks work and IE6 render correctly? I know I will run into this exact problem one day and best get it figured out now, huh?<p> <div id="menu"> <a href="link1.html">link</a><b> | </b> <a href="link2.html">link</a><b> | </b> <a href="link3.html">link</a><b> | </b> <a href="link4.html">link</a><b> | </b> <a href="link5.html">link</a><b> | </b> </div> </div> </body> </html> Thanks! James It's the effect where you click on a link or a button and a new bit of content appears, pushing down everything below it. Clicking it again makes that content disappear and all the original text move back up. Google uses it in a number of places, notably at the bottom of any search result. At the very bottom, below the "Goooogle" page number thing, there's a little plus sign to the left of "Add a result". Clicking that makes new content appear. I see it in a lot of places and I love the effect! I don't know if its Ajax or CSS or whatever, so I don't know how to properly search for a tutorial, but could anyone point me in the right direction? I often see css code with "greater than" sign like this: html>body #centercontent { margin-left: 201px; margin-right:201px; } what does this mean? What is the difference with body #centercontent { margin-left: 201px; margin-right:201px; } Thanks for the enlightment. Hi guys I've a website, pure css, tableless It looks good in Firefox, Opera, etc. etc. It looks VERY bad in IE Look: Firefox http://img465.imageshack.us/img465/4333/shot14jr.png Internet "Explorer" http://img378.imageshack.us/img378/8224/shot22cv.png Website files for download here... http://rapidshare.de/files/11673865/website.zip.html Does any1 know how to fix css or web to look good in IE also ? Thanks a lot in advance Greetings everyone! I'm quite new for css positioning, less than 2 weeks, but I can tell you I feel like a young man entering puberty again just knowing I'll have myself free from tables very soon. My question is an easy one. I would like to know if isnt it more correct to leave some styles outside the css file when we are using it particularly only one time. Lets say Ill use 2 distinguished boxes in the "contact" session, then would it be ok to just use "<div style="etc">content</div>" instead of building it inside the css? Thanks in advance! - Dehumanizer hi... what does this css code mean.. body table table table table#plv table td{color:#fff} ? and how would the html code look like? is this for tables with no class tags attach to it.. i am trying to put a semi-transparent bg on an iframe and some cells of a table. i've been given lots of advice, none working so far. and i know its possible. is there anyway sum1 could try this or even edit my code? but mostly what im looking for is also where to put things in codes. please and thank u!! what would happen if i assigned an iframe to "itself" w/ a colored background, and then put in a CSS declaration w/ opacity? how do i input filters? how do i input tablelayout(like CSS or HTML)? where do i insert tags for the scrollbar, which also has not worked for me? Code: <style type="text/css"> <!-- @import url("semitransparent.css"); @import url("chromafilter.css"); body,td,th { font-family: Herculanum; color: #000000; } a { font-family: Herculanum; font-size: 12pt; color: #FFFFFF; } a:link { text-decoration: none; } a:visited { text-decoration: none; color: #FFFF00; } a:hover { text-decoration: underline; color: #E05D52; } a:active { text-decoration: none; color: #FFFFFF; } .style3 {font-size: 12px} BODY{ scrollbar-3dlight-color:#FFFFFF; scrollbar-arrow-color:#CCCCCC; scrollbar-base-color:#993300; scrollbar-darkshadow-color:#660000; scrollbar-face-color:#990000; scrollbar-highlight-color:#CC0000; scrollbar-shadow-color:#666666; } --> </STYLE> </head> <body> <map name="booster" id="booster"> <area shape="rect" coords="126,87,249,107" href="boosterclub.htm" target="iframe2" onMouseOver="filter:glow(color=#FFFF99,strength="5");"> <area shape="poly" coords="75,49" href="#"> <area shape="rect" coords="345,82,499,108" href="Danceprogram.htm" target="iframe2"> <area shape="rect" coords="588,87,711,106" href="dancecamp.htm" target="iframe2"> <area shape="rect" coords="783,84,971,107" href="fly.htm" target="iframe2"> <area shape="rect" coords="131,42,209,77" href="index2.htm" target="iframe2"> </map> <table width="1134" height="717" border="0" cellspacing="10"> <tr> <th height="174" colspan="2" scope="row"><img src="logofory.png" width="1060" height="112" border="0" usemap="#booster"></th> </tr> <tr> <th width="235" height="37" scope="row" bordercolor="#FFE4E0" border="1">About us </th> <td width="865" rowspan="3"><iframe frameborder="1" name="iframe2" src="index2.htm" allowtransparency="30" width="750" height="432" scrolling="yes"></iframe></td> </tr> <tr> <th height="211" scope="row"> </th> </tr> <tr> <th height="175" scope="row"><table width="235" height="173" border="1" bordercolor="#FFA2A2" bgcolor="#FFE2CB" id="pink"> <tr> <th width="198" height="18" scope="row">New Events!!! </th> </tr> <tr> <th height="128" scope="row"><p>1- We are having a competition this weekend in Portland, OR. Wish our tap girls good luck </p></th> </tr> </table></th> </tr> <tr> <th height="32" scope="row"> </th> <td align="center"><b>Designer:</b> Melody Shinyama <b>Date Published:</b> January 25, 2006 <br><b>Host:</b><a href="http://www.freewebs.com/"> www.freewebs.com</a><br> <b>Last Updated:</b> January 25, 2006 </td> </tr> </table> <p><br> <br> </p> </body> </html> this is also an attached code. btw i am working w/ dreamweaver. Code: <style type="text/css"> tbody {background-color:#FF6971; width: 300px; margin: 0 50px; border: 2px; filter:alpha(opacity=50); opacity: 0.5; -moz-opacity:0.5; } body,td,th { font-family: Herculanum; color: #000000; } a { font-family: Herculanum; font-size: 12pt; color: #FFFFFF; } a:link { text-decoration: none; } a:visited { text-decoration: none; color: #FFFF00; } a:hover { text-decoration: underline; color: #E05D52; } a:active { text-decoration: none; color: #FFFFFF; } .style1 { color: #000000; font-family: Herculanum; } #transbox { width: 300px; margin: 0 50px; background-color: #CF0000; border: 2px solid; filter:alpha(opacity=50); opacity: 0.5; -moz-opacity:0.5; } #bg { width: 400px; height: 300px; background: url(redbg.jpg); background-repeat: repeat; border: 0; } #transbox div { font-weight: bold; color: #000000; filter:alpha(opacity=100); opacity: 1; -moz-opacity: 1; position: relative; visibility: hidden; } </style> this is the last one Code: table, tr, span, li, p, div, textarea, DIV { font-family: Herculanum; color: #000000; font-weight:normal; font-decoration:none; font-style:normal; background-color:transparent; border-color: #000000; empty-cells:hide; } td, li, p, div, textarea { font-family: Herculanum; border-color: #000000; } table{ border-color: #000000; } a.navbar{ font-family: Herculanum; font-size:12pt; font-weight:bold; } a.navbar:link{ color: #CCCCCC; } a.navbar:active{ color: #FFCC00; } a.navbar:visited{ color: #CCCCCC; } a.navbar:hover{ color: #FFCC00; } a.searchlinkSmall{ font-family: Herculanum; font-size:12pt; text-decoration:none; font-weight:normal; } a.searchlinkSmall:link{ color: #999999; } a.searchlinkSmall:active{ color: #FF0033; } a.searchlinkSmall:visited{ color: #999999; } a.searchlinkSmall:hover{ color: #FF0033; } body{ font-family: Herculanum; background-color: #89100D; background-image:url(DanceFloor1-0_big.jpg); background-position:center center; background-repeat:no-repeat; background-attachment:fixed; } .nametext{ font-family: Herculanum; font-size:16pt; color: #000000; font-weight:bold; } .blacktext10{ font-family: Herculanum; font-size:12pt; color: #FF0000; font-weight:normal; } .blacktext12{ font-family: Herculanum; font-size:12pt; color: #999999; font-weight:normal; } .btext, .itext, .text{ font-family: Herculanum; font-size:14pt; color: #FFFFFF; font-weight:bold; } .orangetext15{ font-family: Herculanum; font-size:14pt; color: #FFFFFF; font-weight:none; } .lightbluetext8{ font-family: Herculanum; font-size:14pt; color: #FFFFFF; font-weight:none; } .tmz_imp{ font-family:arial; color: #FF0000; font-weight:bold } a img{ border-color: #666666; border-width:2px; border-style:solid; filter:Alpha(Opacity=60); } a:hover img{ border-color: #666666; border-width:2px; border-style:solid; filter:none; } body{ scrollbar-arrow-color: #FF0000; scrollbar-Track-color: #990000; scrollbar-Highlight-color: #FF0000; scrollbar-base-color: #FF0000; scrollbar-Face-color: #990000; scrollbar-Shadow-color: #FF0000; scrollbar-DarkShadow-color: #FF0000; } I am trying to make this header menu go horizontal but I can't get it to do anything but be vertical. You can see what is happening by visiting SodShopWichita.co m The green buttons. Anyones help would be greatly appreciate as I have spent hours trying to figure it out. I'm new to CSS. Here is the code: /******************************** Main Navigation ****** * Global topmenu navigation, degrades gracefully to css * if Javascript is disabled. Else applies fade effect. */ #navcontainer { height:50px; float: right; width:1014px; position:relative } /* Menu Body */ ul#navigation { height:35px; list-style:none; float:left; padding:0px 1px 0px 0px; margin:0px 0px 0px 10px; float: left; } /* Float LI Elements - horizontal display */ ul#specialnav li { float:left; display: block; } /************ SPECIAL NAV ************************/ #specialnav { height:50px; width:185px; position:relative; } /* Link - common attributes */ #specialnav a { background:url('specialnav.png') no-repeat scroll top left; display:block; height:35px; width:185px; position:relative; z-index:10; line-height:2.5em; font-family: Georgia, Palatino, "Palatino Linotype", Times, "Times New Roman", serif; color:#fff; font-size:14px; text-align:center; text-decoration:none; padding-left: 0px; padding-right: 0px; } /* Specify width and background position attributes */ #specialnav li.isactive a { background:url('specialnav.png') no-repeat scroll 0 -105px; bottom left repeat-x display:block; height:35px; width:185px; position:relative; z-index:10; padding-left: 0px; padding-right: 0px; } /* Link (on hover) - common attributes */ #specialnav li.highlight a:hover { background:url('specialnav.png') no-repeat scroll 0 -35px; display:block; height:35px; width:185px; line-height:2.5em; position:relative; z-index:10; padding-left: 0px; padding-right: 0px; } /* Link - common attributes */ #specialnav li.highlight a:active, #specialnav li.highlight a:focus, #specialnav li a:active, #specialnav li a:focus { background:url('specialnav.png') no-repeat scroll 0 -70px; display:block; height:35px; width:185px; position:relative; z-index:10; padding-left: 0px; padding-right: 0px; } /* fade effects start here */ /* Span (on hover) - common attributes */ #specialnav a span.animate { background:url('specialnav.png') no-repeat scroll 0 -35px; display:block; position:absolute; line-height:2.5em; top:0; left:0; height:100%; width:100%; z-index:10; cursorointer; } /* Shift background position on hover */ ul#navigation li a span { background-position:0px -35px; } /* Shift background position on hover for the class: "isactive" */ ul#navigation li.isactive a span { background-position:0px -35px; } span.trans {display:none;} For some reason, the following code displays perfect in firefox, but its atrocious in IE. Im doing this for a client, so i need it to display correct in all browsers...can anyone pinpoint what i am doing wrong? here is the code: Code: css * { margin: 0px; padding: 0px; } html { width: 100%; height: 100%; } body { height: 100%; width: 100%; background-color: /*#E0F8F7 */#989B9F; margin: 0px; padding: 0px; } #login_box { background: url( '../images/login2.png' ) no-repeat center center; position: fixed; width: 319px; height: 417px; top: 50%; left: 50%; margin-top: -209px; margin-left: -160px; } #input_div { position: fixed; width: 103px; height: 38px; margin-top: 230px; margin-left: 55px; } #lock { border: none; position: fixed; background: url( '../images/lock.png' ) no-repeat; width: 10px; height: 13px; margin-top: 287px; margin-left: 270px; } #forgot { position: fixed; margin-top: 362px; margin-left: 50px; } #login_box h1 { color: #EDF2F7; font-size: 10px; text-align: left; font-family: arial, sans-serif; } .input { width: 200px; font-size: 12px; text-align: left; font-family: arial, sans-serif; border: solid 1px #85b1de; background: url( '../images/gr.png' ) repeat-x #EDF2F7; background-position: top; padding: 4px; } input[type="text"]:focus, input[type="password"]:focus { border: solid 1px #31677B; } #login_box p { font-weight: bold; color: #478FAB; font-size: 12px; text-align: left; font-family: arial, sans-serif; } #button_div { position: fixed; width: 103px; height: 38px; margin-top: 360px; margin-left: 190px; } .button { border: none; width: 103px; height: 38px; text-indent: -1000em; cursor: pointer; background: url( '../images/login_button.png' ) no-repeat center center; } in Internet Explorer: Incorrect in Firefox, Opera, Chrome... ( Any code compliant browser ) Correct ....Any help please? Can anyone help me to transform this table in css code ? <table width="1000" border="1" bordercolor="#FFCCFF"> <tr> <th width="500"> <img src="111.jpg" </th> <th width="500"> <center> <font face="Tahoma" size="60" color="#330033"> 111 </font> </center> </th> </tr> </table> Hello. I'm interested in creating areas within my web page similar to the attachment, that show formatted code. I can handle most of it - using specific font(s), a green left-border, perhaps some banding for alternate rows, etc. But is it possible to create automatic numbering without having to insert separate 'li' elements for each row? Would I have to entity reference lots of characters within the code? Indenting might be troublesome? Perhaps there is some site that already makes this css publicly available? Andy. Please look at this page: http://validator.w3.org/check?uri=w...=Inline&group=0 As you can see all the script codes are in need of helping to pass. I am trying to clean this page up and the rest but need advice to how to do so. For example, it is telling me not to use the & sign in the script but I am afraid to replace it with the & or & . What should I do here or how can I fix these errors? Should I be using a different Doc type or something? Thanks!!! I am having a big problem with my website. It works great on every browser except ie7. The 3 big icons do not appear in a row but one below another, and the 4 boxes on the bottom cannot be displayed. The website is (www dot sdcomptech dot com) Any help is appreciated, everything works but ie7. Sorry....wrong info here....been up too long. I'll regroup and repost this with hthe correct info. I'm a bit new to the CSS scene, but I do know my fair share of it. Unfortunately, I've run into a huge problem: Our menu bar takes up a lot of code that we DON'T want to have to repeat on EVERY page. So, my question is: Is there any code/way we can retrieve data from another source file and have it pulled into our original code? Like an img src=, only with a file. Thanks in advanced! |