HTML <table id=”my_table”> CSS table#my_table { border-collapse:none; width:100% } table#my_table td { margin: 1px; color: #000; padding: 2px 1px; text-align: center; font-weight: bold; } table#my_table td a:hover { text-decoration:none; }
All posts by
.Form General
Simple form: Submit to same page, see here onSubmit E.g. onSubmit=”return capCheck(this);” means call the javascript function called capCheck PHP Handle Form
Select Box
Causing Form To Submit OnChange Loading With Selected Setting From PHP – Using an array Loading With Selected Setting From PHP – Using find and replace on a string Doing specific things Get selected item text
zindex
z-index sets the stack order of the element. It only works on positioned elements (position:absolute, position:relative, or position:fixed). It's natural to assume elements with higher z-index values are in front of elements with lower z-index values, and any element with a z-index is in front of any element without a z-index. This is how it […]
Rollover buttons
Based on this guide http://www.table2css.com/articles/how-create-rollover-image-button-html-and-css-without-any-javascript Create your image double height with the roll over image in the bottom half In the <head> <style type=”text/css”> a.myrollover { display: block; width: 80px; height: 30px; background-image: url(‘button_combined.png’); } a.myrollover:hover { background-position: center bottom; } </style> Then for your link <a href=”#” class=”myrollover”></a>
.Lists
Targetting Specific List Elements Hide the li class “comments” in ul “meta-single”: Getting rid of list dots Using An Image As The List Bullet Point 2 Column List List items in a horizontal line and with an icon each
Hover
You can use :Hover on anything – doesn't have to be a link E.g. .my_style_name:Hover { color: #000000; } Tool Tip Style Hover Text You can use the title attribute to add pop up text to most things: <span title="Text that will show on hover">Text on page</span> Using CSS instead when you want to […]
Font
Global font Set the font in the <body> style and nowhere else to allow the font to be changed from one place. Spacing Lines If you don’t want the spacing between paragraphs use margin. If you set margin to 0 there will be no spacing. If you have a gap between 2 different sytles, then […]
Creating A Page On A Background
CSS .page_background { background-color: #FFFFFF; width: 924px; padding: 8px; margin-top: 0px; margin-right: auto; margin-left: auto; margin-bottom: 0px; } .page_background_shaddow_top { width: 950px; padding: 0px; margin-top: 10px; margin-right: auto; margin-bottom: 0px; margin-left: auto; background-image: url(images/background_drop_shaddow_top.gif); height: 5px; } .page_background_shaddow_middle { width: 950px; padding: 0px; background-image: url(images/background_drop_shaddow_sides.gif); background-repeat: repeat-y; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; […]
Scroll Bar Box
Fixed size box with scroll bars pre { background-color:#FDFDFD; font: 1.0em ‘Courier New’, Courier, Fixed; overflow: auto; line-height: 1em; width: 640px; margin-top: 5px; margin-right: 0px; margin-bottom: 10px; margin-left: 10px; padding: 5px; text-align: left; Scroll bars only appear when you hover pre { background-color:#FDFDFD; font: 1.0em ‘Courier New’, Courier, Fixed; overflow: hidden; line-height: 1em; width: […]