CSS - Where Do I Start? Real Weird !!
ok ill paste my code for the page and css up -
Quote: <?php require("header.php"); ?> <div id="content"> <br><br> <b>Welcome to Kadafi Legacy.</b><br><br> <img src="image/yaki1.jpg" alt="Yaki Kadafi" align="left"> Here at Kadafi Legacy we aim to bring you the latest and most in depth information on Yaki Kadafi, such information will include the family and friends of Yaki Kadafi, Kadafi's childhood years, the records Kadafi featured upon and all this and much more can be found at our <a href="/history.php" alt="Yaki Kadafi History">Kadafi history</a> section.<br><br> The latest news and information regarding projects from the official Kadafi site - <a href="http://www.yakikadafi.com" target="_blank" alt="YakiKadafi.com">YakiKadafi.com</a>, will also be reported and updated daily in our <a href="/news.php" alt="Yaki Kadafi News</a>Kadafi News</a> section.<br><br> Here at Kadafi Legacy we aim to bring you the latest and most in depth information on Yaki Kadafi, such information will include the family and friends of Yaki Kadafi, Kadafi's childhood years, the records Kadafi featured upon, all this and much more can be found on our <a href="/history.php" alt="Yaki Kadafi History">Kadafi history</a> page.<br><br> content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content </div> <br> <div id="foot">Graphics & Design by "NO NAMED DESIGNS" - Copyright 2006 "KLSOON2BE"</div> </body> </html> ok now, as you see... the writing above all the "CONTENT" and the words "content" should all be on my page as text here - www.outlawz.frihost.net/fula/test2.php however, all of it is on the page apart from the part i put in bold, the third paragraph... also, in the second paragraph my link is for "news" on the page it says its for "history" if i remove this third paragraph... then the page completely messes up and it has only the first 2 paragraphs and no "content" words show up and the "designed by..." is directly under the first 2 paragraphs in the blue... here is my css - Quote: a:link {color:white} a:visited {color:white} a:hover {color:black} a:active {color:white} body {background-color: #666666} #head img { display: block; } #head{ position: relative; top: 7px; left: 140px; width: 707px; font-family: verdana; font-size: 12px; color:white; background-color: #666666; background-image: url(wavy.jpg); } #box1{ position: relative; top: 7px; left: 140px; width: 345px; font-family: verdana; font-size: 12px; color:white; background-color: #666666; background-image: url(wavy.jpg); } #content { position: relative; top: 7px; left: 140px; width: 697px; height: 500px; font-family: verdana; font-size: 12px; color:white; text-aligh: justify; background-color: #666666; background-image: url(image/back.jpg); padding: 5px; } #foot{ position: relative; left: 140px; width: 707px; font-family: verdana; font-size: 9px; text-align: center; color:white; background-color: 666666; background-image: url(wavy.jpg); } really confusin me HAHA.. please help, thx!!! Similar Tutorialshi i have this site www.londonbydesign.co.uk and I cant figure out how to get my mail link on the same line as my text with the same styles though. I cant do it. Please help! I am completely new to CSS. I usually use A LOT OF tables in my designs, and want to switch to CSS now. Anyways, I am trying to put 2 divs next to each other. here is what I have http://www.findagoodhost.com/2/ I'd like to make them as if I put a table with 1 row, 2 columns, but with CSS positioning. Any help would be apreciated. Thanks Hello all, This isn't really all that important since I'm using the transitional DTD for HTML 4.01, but, I am curious. For my own work, and not work done for the company I work for, I stick to strict. I don't know about any caveats in technical documentation writing, but I need to provide a tip or note regarding an item in the list. Here is an example of what I'm, doing. item 1 item 2 item 3 item 4 NOTE:a tip regarding item 4 (<-should be a 5) item 5 (<-should be a 6)item 6 To do it in HTML transitional, you can still use the value property: html4strict Code: Original - html4strict Code <ol> <li>item 1</li> <li>item 2</li> <li>item 3</li> <li>item 4</li> </ol> <p>note:blah blah blah</p> <ol start="5"> <!-- this works too --> <li value="5">item 5</li> <!--this also work --> <li>item 6</li> <!-- value not required here if you're using value because it's an ORDERED list so defining the value at the start will begin the order--> </ol>
I found the answer to my own question... w3schools sucks. In the LISTS section of the categorized reference they don't have anything that resembles counter-reset...or in any section for that matter. So does IE 7 for that matter, since it doesn't render the expected results. Here is where I found a usable solution...not yet tested with IE though. http://www.arraystudio.com/as-works...-using-css.html Maybe it's just my inability to fight with IE anymore...but visual studio tells me not to use start. Doesn't say anything about value as a li property though. Being lazy and this being a oneoff, and not really wanting to keep track of if dynamically, I tried to put it as inline styles, which doesn't work in Firefox either. Hello. I designed my site using Ie, and an now getting some complaints from members who are switching to firefox. I am a total CSS newbie and I don't know exactly where to begin to troubleshoot this. URL thats the page, you will need to use username: css password: test It looks fine in IE6, but doesnt look ok in firefox. The CSS stylesheet is at URL Thank you for any help you can provide. just look at my site in firefox, then IE, if you have it. horrible. how do i correct everything? firstly, the main div columns which are floated left end up like normal non-floating divs, so they are stacked vertically. Code: <div id='leftcolumnmenusouter'><!-- left column menus --> <div id='leftcolumnmenus'> <?php include "columnmenus.php"; ?> </div> </div> <div id='maincontentcolumnouter'><!-- middle column --> <div id='maincontentcolumn'> <?php if (is("home")) { include "home.php"; } else if (is("register")) { include "register.php"; } else if (is("login")) { include "login.php"; } else if (is("comment")) { include "comment.php"; } else if (is("profile")) { include "profile.php"; } else if (is("category")) { include "category.php"; } else if (is("game")) { include "game.php"; } else if (is("links")) { include "links.php"; } else if (is("rules")) { include "rules.php"; } else if (is("faq")) { include "faq.php"; } else if (is("pp")) { include "pp.php"; } else if (is("links")) { include "links.php"; } else if (is("page")) { include "page.php"; } else if (is("news")) { include "news.php"; } else if (is("users")) { include "users.php"; } else if (is("search")) { include "search.php"; } else if (is("taf")) { include "taf.php"; } /*else if (is("submit")) { include "submit.php"; } */else if (is("pm")) { include "pm.php"; } else if (is("play")) { include "play.php"; } else if (is("request")) { include "request.php"; } else if (is("contact")) { include "contact.php"; } else { include "error.php"; } ?> </div> </div> CSS: Code: #maincontentcolumnouter { width:75%; margin:0px; float:left; } #maincontentcolumn { margin-top:8px; margin-bottom:0px; margin-left:4px; margin-right:8px; } #maincontentcolumn .ocontentsection { margin-bottom:8px; } #maincontentcolumn h2 { text-indent:1em; } #leftcolumnmenusouter { width:25%; margin:0px; float:left; } #leftcolumnmenusouter #leftcolumnmenus { margin-top:8px; margin-bottom:0px; margin-left:8px; margin-right:4px; } #leftcolumnmenus .ocontentsection{ margin-bottom:8px; } #leftcolumnmenus h2{ text-align:center; } #footer { margin:0px; padding:0px; clear:both; } Hi, This is my code Code: <style type="text/css"> #leftcolumn { float: left; width: 10%; text-align: center; margin: 30px auto; } #rightcolumn { float: left; width: 25%; text-align: center; margin: 30px auto; } </style> <div id="leftcolumn"> <p>Left 1</p> </div> <div id="rightcolumn"> <p>Right 1</p> </div> <div id="leftcolumn"> <p>Left 2</p> </div> <div id="rightcolumn"> <p>Right 2</p> </div> I expected it to be centered and both left and right 1 and 2 to be on the same line each left and right I want to start on a new line, although currently they are both on the same line, how can I do this Thanks This was my first css project done a couple of months ago, and I recently added some functionality to finish it off. A quick check in different browsers and I find its hosed in Mozilla and Opera. Usually this wouldn't be a problem, and normally requires some light adjustment, but this page is just hosed. Opera doesn't even react to adjustments I make. I've got 6 hours into trying to make this cross browser, and nothing works. Even link classes that work in IE/Opera, are completely ignored in Mozilla. I'm assuming if you look at the source you'll be able to see whats going on. I'm trying to break the formatting out of my page to post here for ease of reading, but its taking me some time. The desired effect is acheived in IE. Any opinions, or help would be appreciated! When you first load the page, you get the impression that there isn't much, if anything to scroll down to. But if you try anyway, the long scrollbar button quickly collapses, revealing that indeed there is much more to scroll down to. Why is this? The page is three tables with about 7 rows each. And OF COURSE this works perfectly in Mozilla browsers. Ive seen a few of those transparent popups that appear on certain websites...but they don't envoke popup blockers so, I'm assuming they are some manipulation of CSS? When they popup, it appears that the rest of the screen grays down a bit until you take action on the popup. Any ideas? Thanks all! Hey everyone, I have an odd problem. CSS Code: Original - CSS Code ul#admin_menu li.am_item{ float:left; clear:none; display:inline; border:0; padding:0; margin:0; width:24%; } ul#admin_menu li.am_item{ This works... CSS Code: Original - CSS Code li.am_item{ float:left; clear:none; display:inline; border:0; padding:0; margin:0; width:24%; } li.am_item{ This doesn't work... I don't understand why. What gave it away was the display:inline; The first one displays them inline, the second displays them block and they don't get their width. omg I am going to fall from the window with this stupid language lol... Until yesterday, I was designing properly my site, using css and linking it in my php properly andddddddd.......... today I noticed a weird result. When I change something in css, I can see no result in the site. Even if I delete code from css, the site seems to be cached! I use Mozilla, I tried to clean cache, the css is properly linked... whats going on now Have anyone else faced a similar problem?... Hello, I have a free text search with auto suggestion that opens below the input box. I finally managed to make it look good in all browsers, but I have one problem left in IE - when the auto suggestion div opens with the options and I press the down arrow to move down the list, there is a little jump. You can see it by going to : bateries.websitebuildingsolutions.com in IE and enter "b1" in the search box, wait a second for the div to open and than press the down arrow to move down the list. What can I do to fix this? Thanks if you check out this website you'll immediately understand what the problem is about. The script I wrote, pulls pictures out of a database and displays them. I have a print feature (click the link that says: Ik wil de klassenlijst van **** afprinten). With Css I check wether or not a picture can be displayed on this page or if it has to be forced onto another page, when printed. Code: <style type="text/css" media="print"> table { page-break-befo auto; } </style> When you check the webpage, you'll notice this row gives problems in IE. When I print the page from Internet Explorer: this row shows on the page, but not the picture that goes along with it. When I print the page from Mozilla: this row does not show on the page, neither the picture that goes along with it. as it should be Can someone help me? It is very important that the pagebreak is automagically forced when printed, because I can't guess the format on which people will print. Hey gang, quick question. I'm tring to make a "Thermometer" of sorts for my site, and instead of making lots of images in photoshop, I figured I could do it a little more dynamicly using divs and css. I was right, as Firefox displays my code perfectly, however, IE messes up the whole thing by keeping the allocated space for the one div in the place where its positioned in the code. Dumb thing. I figure it has something to do with the display property, but I'm not sure which to use. Any suggestions? Thanks! PHP Code: <div style="height: 500px; width: 100px; padding: 0px; margin: 0px; border: 0px black solid; background: url('meter_color.jpg');"> <div style="position: relative; top: 0px; left: 0px; height: 125px; width: 100px; padding: 0px; margin: 0px; background: #FFFFFF; z-index: 1;"></div> <div style="position: relative; top: -125px; left: 0px; height: 500px; width: 100px; padding: 0px; margin: 0px; background: url('mask.gif'); z-index: 2;"></div> </div> (images attached) -Jim I've got a body of text within a DIV tag. For some reason, if I roll my mouse over the text, the entire body of text changes color as if it were a link. I've double checked to see if there are any open HREF tags but there are none. Any ideas? Safari 1.3 on Mac OSX 10.3.9 if it matters. I've also tested on Netscape, Opera, Firefox and IE and all of these work fine. here be the code: Code: .mainBody { color: #000; font-family: helvetica, arial, "sans serif"; font-size: 12px; text-align: justify; padding-left: 35px; padding-right: 35px; } .mainBody:link, .mainBody:visited { color: #600; text-decoration: underline; } .mainBody:active, .mainBody:hover { color: #996600; text-decoration: none; } .pageLinks { color: black; font-family: helvetica, arial; font-size: 14px; text-align: center; } .pageLinks:link, .pageLinks:visited { color: #960; text-decoration: underline; font-size: 14px; } .pageLinks:active, .pageLinks:hover { color: #960; text-decoration: none; font-size: 14px; } I have a basic 2 column layout with a header and the columns reprezented by two floated divs but on IE I'm experiencing some weird behaviour with the menu. To be precise the menu's background and content is not showing up at pageload and I have to hover some of it's elements or resize the window, or bring another window above IE's window and then the hidden elements magically appear. Is this some common bug? And more important: is there a fix? You can see my example at the following link -> http://www.link7.ro/misc/css-stuff/bug1/test.html Thanks in advance. The border around the fieldset in IE7 is messed up. The right border is shifted to the left several pixels. It looks fine in IE6. In FF the border isn't shifted but there is less padding on the right side of the fieldset than the left. I can't figure that one out either. If I zero out all the padding & borders the input/textareas push a few pixels out the right side of the fieldset. Looks fine in IE6. So has anyone seen either of these issues and might know how to correct them? Here is the page in question Thanks! Hi, I'm trying to display text in a floating div in the middle of the page. The style is as follows: Code: .mainContentAreaBackground { position:absolute; z-index:11; top: 190px; left: 230px; width:70%; height:72%; } #mainContentArea{ z-index:12; position:absolute; overflow:auto; overflow-x:hidden; width: 67%; height: 68%; top:205px; left:246px; text-align:left; font-family:Tahoma; font-size:10.0pt; visibility:visible; } There are two anomalies which I think might be bugs in IE's implementation of CSS, and I was hoping someone might be able to give me some advice as to how to get around them. The first problem is that, when going to highlight text in the main content area, all objects on the page are selected, rather than just the intended text. The second anomaly is that, when using the mouse wheel to scroll down in the mainContentArea div when there's overflow, the cursor needs to be hovering over text. If it's hovering over any place with a "hole" in it, such as the space between paragraphs, then it will not scroll. Everything works fine in Firefox. You can see what I'm talking about he http://www.cs.mcgill.ca/~jbeard4/lepdev If anyone has any advice, please let me know. Thanks! -Jake Hey, at my site: http://www.optimumnutrition.com/products in IE/6 I am having a problem with the last side box in the left column. You can see a gap between the link to conditions of use and the curved bottom of the box. Anyone see where this is coming from? Thanks, Ryan |