Jump to content


Staff Alumni
  • Posts

  • Joined

  • Last visited

Everything posted by cssfreakie

  1. well, the -moz- and -webkit- are prefixes that target specific brands of browsers (there is even -o- for opera). And border-radius is a css3 property. No need to worry about that. The reason why you don't have to worry about it is because other browsers that don't support it will just ignore it. It will not cause any problems.
  2. I am not sure what you meant to say with the previous 3 responses. but if it didn't work. make sure your browser is ready for box-shadow. All recent versions of firefox chrome and IE support it.
  3. you might want to consider instead of using those empty divs left and right to use a padding left and right of 7 px on the middle div. Saves mark up and makes more sense if you look at the boxmodel.
  4. Oh i just played abit with css3 boxshadow and that is a possibility too, it seems. try it: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <style type="text/css"> .line { box-shadow: 0 3px 1px -3px #000; display: inline-block; line-height: 10px; width: 50%; } </style> </head> <body> g<span class="line">o</span> </body> </html>
  5. you can draw lines with html5 canvas. With css, you require a background image (and than position it so it just touches the 'o') if you want to come close to what you have in your attachment. otherwise text-decoration or border-bottom could work, but that would create a greater gap.
  6. Before I forget. <input> is an inline element, to give it dimensions other than by adding a value. You need to display it block or inline-block. Ones you've done that you can style it the way you want. So that is what i did in the example given above. good luck!
  7. I am not sure what you mean with label a button, but if you want to set your own background image to a submit button (which is independent of javascript) try the following: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <style type="text/css"> .fancybutton{ display:block; /* use inline block if you want it to behave inline */ width:116px; height:21px; border:none; cursor:pointer; /* little hand to show it's a button */ background: url('round_corner.gif') no-repeat; } </style> </head> <body> <form action="" method="post"> <input type="submit" name="submit" class="fancybutton"/> </form> </body> </html> notice I gave submit a class and in css I set the properties for it instead of in the html itself. That way you separate concerns. Ones you played with this and want a something more advanced, like a stretching button. Google for css sliding doors. -edit: if you also validate your html/css most basic errors can easily be fixed
  8. I mentioned 2 separate things. the minheight is for all browsers so just pput that in you original stylesheet. the second things was that you said in IE6 my site looks broken. A common cause for that is that someone didn't supply display:inline on floated elements. But if i were you I wouldn't bother really. the link i gave about conditional commets is pretty clear. You place those in between the <head></head> tag there you can either add some styletags, just for ie6 or a <link> to an external stylesheet have a look at http://eu.battle.net/wow/en/ and than view source. A clear example of targeting multiple browsers by using conditional comments.
  9. hehe crmamx, no need to apologize, it's not even my own monkey nor photo Just use it, it's fun! although i like the little monkey hanging on a branch more something that could be nice to know is that if you target ie6 if you use float you need to set an extra property called display:inline; Now that only counts for the first element that is floated either left or right, but it won't harm your site if you apply it too all things that are floated. if you used a reset.css most browser differences are gone. Anyway if you have loads of time left, use a conditional comments to give that display inline property to only ie6. more info on conditional comments here: http://www.quirksmode.org/css/condcom.html it could look like this: normal stylesheet: #columnleft{ float:left; width:400px; overflow:hidden; } stylesheet for ie6 #columnleft{ display:inline; /* because this element is floated */ }
  10. I made them all the same height with my photo editor so do I still need to do that? You did indeed, but what you didn't do is give them all a caption, making some objects higher than others. by supplying min-height you can fix that. see image, what could happen on a different screensize [attachment deleted by admin]
  11. Oh crmamx you might want to add a minimum height of say min-height: 210px; to your photo album otherwise smaller images flow around the bigger ones. this page: http://bayarearcsociety.com/tutorial/example_photo_album.html
  12. looks good Curtis! you already got my review
  13. well I never tried that, but i bet both php and javascript have something that can see what the string length is and do something with that info. for php. for php strlen() could be something to have a look in: http://www.php.net/manual/en/function.strlen.php than make some sort of if clause, if strlen() is 1000 insert a pagebreak. just a brainfart, but that's how i would think when searching.
  14. indeed, but this way you can alter the output.... which is what you wanted (a string with a dot at the end)
  15. maybe instead of directly echoing the value, assign the value to a string with .= like: $string = 'monkeys '; $string .= 'eat '; $string .= 'banana\'s'; $string .= '.'; echo $string; // outputs monkeys eat banana's.
  16. pictures or i don't believe it you can mark it solved too if you find that a bit too much. (left bottom of the screen)
  17. as far as the validator: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.sullens.net%2F~mthomas%2Fcins258%2Fproject%2Fcalendar.phtml%3F&charset=%28detect+automatically%29&doctype=Inline&group=0 you have 3 errors, i find that it explains very well what is missing, if you have a specific question about one of the 3 errors let us know.
  18. next time if you post code try out the bbcode code tags marked in the editor with a #sign a normal if statement would look like this: $name = 'john'; //setting a variable; if($name == 'john'){ // condition, is name equal to lower case 'john' notice we use == and not = echo "hello $name"; }else{// so incase the condition is not as expected echo "sorry you are not john"; } See the brackets, inside them you put the events that should happen ones a condition is or is not as expected. and again remove that @ sign it's an error suppressor and when developing we need errors in order to know what we do wrong.
  19. Not sure if this is the best metod, but it does the trick. functions to look for in the manual are strtotime() and date() $time = strtotime("now +12 hours"); $format = date("D M j G:i:s T Y", $time); echo $format; good luck!
  20. yes he means that != means 'is not equal too" it's the opposite of == which means "equal too" more info here: http://www.php.net/manual/en/language.operators.comparison.php so your statement actually says if the value of session[auth] is not equal to yes,... than say 'hello', while you want the complete opposite. Also the use of brackets can increase the readability of your script for yourself and others. assuming you work in a development environment remove the @ signs (error suppressors), and place the following above your script. <?php error_reporting(E_ALL); ini_set("display_errors", 1); ?> another thing, where does $firstName get it's value from?
  21. have a look here: http://www.javascriptkit.com/dhtmltutors/pagebreak.shtml keyword is page break. Also in case you were not aware, you can make a special stylesheet for printing purposes. hope this helps in a way.
  22. Glad it worked! as far as grid systems you might want to have a read here: http://www.tripwiremagazine.com/2009/06/45-css-grid-systems-layout-generators-and-tutorials-that-every-designer-should-know.html I prefer the 960-grid the yui-grid and stubbornella's grid (which i am not sure is in that article) As for a living, i sell snow to Eskimo's
  23. well, position relative is not needed to center something, besides that the margin:0 auto; trick works only for block elements. now lets look at your markup: <div class="clearfix" id="slider_wrapper">.....</div> so not only does it get it's style from the ID #slider_wrapper but also from class .clearfix and since it inherited from style.css line 389 a class of .clearfix with the property inline-block it won't behave any more as a block would. So the margin:0 auto; trick won't work. In other words give it a property of display:block; and all should be fine except for some extra margin you probably have to add to the top of that div. If you would have used a gridsystem, this could have been done much cleaner. (something to think about on your next project) Hope this helps!
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.