/* Firefox Picks Up The !Important IE 6 and 7 do not */
#FireFux {
width:100px !imporant; width:50px;
}
(Credit to: mdibb.co.uk)
a.linky, a:hover.linky, a:active.linky, a:visited.linky {color:FF0000; font-weight:bold;}
OR defining links for an entire page
a:link, a:visited, a:active, a:hover {color: #FF0000;}
OR defining links for a specific DIV ID
#LinkDiv a:link, #LinkDiv a:visited, #LinkDiv a:active, #LinkDiv a:hoover {color: #FF0000;}
Thanks Román! Check out Román Cortés page.
Easy to implement and cross browser, cross platform compatible. Make sure that you include <div style="clear:both;"></div> after your columns so that subsequent information is displayed below your "table" and not to the right or left. (Thank you Maria!)
#main {width:600px;border:1px solid orange;}
#column1 {float: left;margin: 1em; background-color:red; width:150px; height:150px;}
#column2 {float: left;margin: 1em; background-color:blue; width:150px; height:150px;}
#column3 {float: left;margin: 1em; background-color:yellow; width:150px; height:150px;}
<div id="main">
<div id="column1"></div>
<div id="column2"></div>
<div id="column3"></div>
<div style="clear:both;"></div>
</div>
body {
font-family: "Trebuchet MS", arial, sans-serif;
font-size: 11px;
OR
font:12px "Trebuchet MS", arial, sans-serif;
color: #5F3E31;
line-height: 14px;
margin: 0;
padding: 0;
text-align: center;
}
Default font property values:
element {
font-style: normal;
font-variant:normal;
font-weight: normal;
font-size: inherit;
line-height: normal;
font-family:inherit;
}
ul.list {width: 420px; border:1px solid;}
ul.list li {
width: 190px;
float:left;
margin-right: 10px;
background: url(http://images.thenestbaby.com/registry/bullet.gif) no-repeat 4px left;
padding-left: 10px;
}
* html ul.list li
{width: 187px;}
.regText {
font-family: arial, verdana;
color: #5f3e31;
font-size: 10px;
font-weight: bold;
}
|
ul.gwc_list {
padding-left:0;
margin:0;
list-style-type:none;
}
.gwc_list li {
background: url(image/blm_gwc_dot.gif) no-repeat 5px 2px;
padding-left: 7px;
}
#guide_list {
padding-left:0;
margin-left:0;
}
#guide_list li {
list-style-type: none;
}
<ul id="guide_list">
<li><strong<a href="#">One</a></strong></li>
<li><strong><a href="#">Two</a></strong></li>
<li><strong><a href="#">Three</a></strong></li>
<li><strong><a href="#">Four</a></strong></li>
</ul>
| test | test | test |
| test | test | test |
Centering a div
#CenterMe2 {
width:500px;
margin: 0 auto;
border:1px solid #FF0000;
text-align:left;
}
IE is retarded so you have to use the text-align:center; tag
on the outside div then text-align:left; on the inside div
body {margin:0px; padding:0px;}
#CenterMe {
position:absolute;
left:50%;
width:500px;
margin-top:50px;
margin-left:-250px; /* Set to half width. */
padding:15px;
border:1px dashed #333;
background-color:#eee;
}
body {margin:0px; padding:0px;}
/* You should set body margin and padding 4 browser consistency. */
Credit to Blue robotAnother Example - http://www.sitecrafting.com/blog/to-center-div/