CSS - Need To Change Title Font In Wordpress Posts
I have a Wordpress Blog and the theme I am using is displaying a font which I don't like and I'd like to change it. I want to change the font used in the title of each post.
No matter what I try, I cant seem to change it. I need some help. Here is the Style Sheet. Code: /* WARNING! DO NOT EDIT THIS FILE! To make it easy to update your theme, you should not edit the styles in this file. Instead use the custom.css file to add your styles. You can copy a style from this file and paste it in custom.css and it will override the style in this file. You have been warned! :) */ /* Default styles */ @import "css/reset.css"; /*------------------------------------------------------------------------------------------- INDEX: 1. SETUP -1.1 Defaults -1.2 Hyperlinks 2. SITE STRUCTURE & APPEARANCE -2.1 Containers & Columns -2.2 Navigation -2.2.1 Page Navigation -2.2.2 Category Navigation -2.2.3 Search -2.3 Header -2.4 Content -2.5 Sidebar -2.6 Footer -2.6.1 Footer Widget Area -2.7 Featured Area 3. POSTS -3.1 Typographic Elements -3.2 Images -3.3 Pagination / WP-Pagenavi -3.4 Buttons / Banners 4. WIDGETS -4.1 Generic Widgets -4.2 Specific Widgets -4.3 Sidebar Tabs -4.4 Video 5. COMMENTS -5.1 Comments -5.2 Comments Form -5.3 Pingbacks / Trackbacks 6. MISC -------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------*/ /* 1. SETUP */ /*-------------------------------------------------------------------------------------------*/ /* 1.1 Defaults */ body { font: 12px Arial,Helvetica,Sans-serif; line-height: 1.2; color: #333; background-color: #e4e4e4; } h1, h2, h3, h4, h5, h6 { margin: 0; font-family: Arial,Helvetica,Sans-serif; color: #000; line-height:1; } h1 {font-size: 36px; } h2 {font-size: 28px;} h3 {font-size: 20px;} h4 {font-size: 18px;} h5 {font-size: 14px;} h6 {font-size: 12px;} p {margin: 0;} /* 1.2 Hyperlinks */ a:link, a:visited { text-decoration:none; color: #838C1C; } a:hover {text-decoration:none;} .entry a:hover, .widget a:hover {border-bottom:1px dotted;} h1 a:link, h1 a:visited, h2 a:link, h2 a:visited, h3 a:link, h3 a:visited, h4 a:link, h4 a:visited, h5 a:link, h5 a:visited, h6 a:link, h6 a:visited { text-decoration: none; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {text-decoration: underline; border:none !important;} /*-------------------------------------------------------------------------------------------*/ /* 2. SITE STRUCTURE & APPEARANCE */ /*-------------------------------------------------------------------------------------------*/ /* 2.1 Containers & Columns */ #container { } #top { background:#232323 url(images/bg.jpg) no-repeat top center; } .col-left { float: left; } .col-right { float: right; } .col-full { width: 960px; margin: 0 auto; } /* 2.2 Navigation */ #navigation, #page-nav {font-size:11px;} #navigation a:hover, #page-nav {border:none;} #page-nav ul.rss{background:url(images/ico-rss.png) no-repeat right 8px;padding:0 35px 0;} #page-nav ul.rss li{float:left;width:auto;} #page-nav ul.rss a { line-height:29px; display:block; padding:0 10px; } /* 2.2.1 Page Navigation */ #page-nav { position:relative; background:url(images/bg-pagenav.png) repeat-x; height:29px; font-family:Verdana, Geneva, sans-serif; font-size:10px; text-transform:uppercase; } #page-nav a { color:#eee; text-decoration:none; text-shadow: #333 0px 1px 0px; } #page-nav a:hover { background:url(images/nav-hover.png) repeat; color:#fff; } #page-nav .ico-home { padding:7px 0 6px 0; } #nav, #nav ul { position:relative; z-index:200; margin:0; padding:0; list-style:none; line-height:1; } #nav a { display:block; z-index:200; padding:0 10px; line-height:29px; text-decoration:none;} #nav li { float:left; width: auto; } #nav li ul { position: absolute; left: -999em; width: 180px; } #nav li ul li { background: #7d7d7d; } #nav li ul li a { width:160px; line-height:26px; color:#eee; } #nav li ul li a:hover { color:#fff; } #nav li ul ul { margin: -26px 0 0 180px; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul { left:-999em; } #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { left: auto; } #nav li:hover,#nav li.hover { position:static; } /* 2.2.2 Category Navigation */ #cat-nav { position:relative; background:url(images/bg-catnav.png) repeat-x bottom; height:58px; border-top:1px solid #fff; } #cat-nav a { color:#333; text-decoration:none; text-shadow: #fff 0px 1px 0px; } #cat-nav a:hover { color:#000; } #cat-nav li:hover { background:#e6e6e6; } #cat-nav a span { font-family:Verdana, Geneva, sans-serif; font-size:11px; font-style:normal; font-weight:400; color:#888; text-shadow:none;} #cat-nav .nav-description { display:block; } #cat-nav a:hover span { color:#555; } #secnav li a span.sf-sub-indicator { display:none; } #secnav li ul li a span.sf-sub-indicator { display:inline; } #secnav, #secnav ul { position:relative; z-index:100; margin:0; padding:0; list-style:none; line-height:1; background: url(images/secnav-div.png) no-repeat right; } #secnav a { font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-weight:700; font-size:14px; display:block; z-index:100; padding:0 15px; line-height:58px; text-decoration:none;} #secnav li { float:left; width: auto; background: url(images/secnav-div.png) no-repeat left; height:58px; } #secnav li ul { position: absolute; left: -999em; width: 180px; } #secnav li ul li { background:url(images/bg-catnav.png) repeat-x bottom; border:1px solid #ddd; border-width:0 1px; height:30px; } #secnav li ul li a { font-family:Verdana, Geneva, sans-serif; width:160px; line-height:30px; padding:0 10px; font-size:11px; font-style:normal; font-weight:400; color:#555; } #secnav li ul ul { margin: -30px 0 0 180px; } #secnav li:hover ul ul, #secnav li:hover ul ul ul, #secnav li.sfhover ul ul, #secnav li.sfhover ul ul ul { left:-999em; } #secnav li:hover ul, #secnav li li:hover ul, #secnav li li li:hover ul, #secnav li.sfhover ul, #secnav li li.sfhover ul, #secnav li li li.sfhover ul { left: auto; } #secnav li:hover,#secnav li.hover { position:static; } /* 2.2.3 Search */ #cat-nav #search { background:url(images/bg-search.png) no-repeat; height:31px; width:181px; margin-top:14px; position:relative; } #cat-nav #search input { background:none; border:none; padding:8px 25px 8px 12px; width:156px; margin:0; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-size:12px; color:#9d9d9d; } #cat-nav #search input.submit { position:absolute; right:8px; top:7px; width:15px; height:16px; padding:0; margin:0; } /* 2.3 Header */ #header{padding:25px 0;clear:both;position:relative;} #logo { min-height:70px; } #logo img { } #logo .site-title, #logo .site-description { display: none; } #logo .site-title { padding-top:15px; } #logo .site-title a { color:#fff; font-size:36px; font-weight:bold; line-height:36px; text-transform:uppercase; letter-spacing:-2px; text-shadow: #000 1px 1px 0px; } #logo .site-title a:hover { text-decoration:none; color:#eee; } #logo .site-description { color:#bbb; text-transform:uppercase; font-size:11px; text-shadow: #000 1px 1px 0px;} #topad{position:absolute;right:0px;top:36px;} #twitter-top { position:absolute;right:0px;top:36px; overflow:hidden; } #twitter-top div.logo { float:left; background:url(images/bg-twitter.png) no-repeat; width:60px; height:76px; } #twitter-top div.tweet { float:left; background:url(images/bg-twitter.png) no-repeat right; max-width:450px; height:76px; } #twitter-top img { float:left; margin: 14px 0 0 15px; } #twitter-top #twitter_update_list { padding:11px 20px 0 0px; font-family:Georgia, "Times New Roman", Times, serif; font-size:12px; font-style:italic; color:#eee; line-height:18px; } #twitter-top #twitter_update_list a { color:#eee; border-bottom:1px dotted; } #twitter-top #twitter_update_list a:hover { color:#eee; border-bottom:1px solid; } /* 2.4 Content */ #content{min-height:400px;padding:0; margin:20px auto 30px;} * html #content{height:400px;} #main{width:640px;} #main.fullwidth { width: 960px; } /* 2.5 Sidebar */ #sidebar{width:300px;overflow:hidden;} /* 2.6 Footer */ #footer{ background:#828282; color:#cacaca; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-size:11px;padding: 25px 0;border-top: 1px solid #b3b3b3;} #footer a { color:#cacaca; } #footer a:hover { border-bottom:1px dotted; } #footer #credit img{vertical-align:middle; } #footer #credit span{display:none;} /* 2.6.1 Footer Widget Area */ #footer-widgets{ position:relative; background:url(images/bevel-footer-widgets.png) repeat-x top; background-color:#c1c0c0; border-bottom:1px solid #7b7b7b; } #footer-widgets .container { background:url(images/bg-footer-widgets.png) no-repeat center 2px; padding:30px 0 10px; } #footer-widgets .block { width:300px; float:left; margin:0 30px 0px 0; } #footer-widgets .block.last { margin-right:0;; } #footer-widgets .widget h3 { background:url(images/bg-footer-widget-title.png) repeat-x; text-shadow: #fff 0px 1px 0px;} /* Featured Area */ #loopedSlider { position:relative; width:960px; background:#e5e5e5; border-bottom: 1px solid #b9b9b9; border-right: 1px solid #d0d0d0; } #loopedSlider .container { width:640px; height:340px; overflow:hidden; position:relative; background:#fff; border-right:1px solid #d0d0d0; } #loopedSlider .slides { position:absolute; top:0; left:0; } #loopedSlider .slides div.slide { position:absolute; top:0; width:640px; display:none; } #loopedSlider .slides .post-bottom { border-bottom:none; } #loopedSlider .featured-nav { width:318px; float:right; } #loopedSlider ul.pagination { list-style:none; padding:0; margin:0; border-top:1px solid #d0d0d0;} #loopedSlider ul.pagination li { float:left; border-bottom:1px solid #f6f6f6;} #loopedSlider ul.pagination li a { width:278px; display:block; padding:15px 20px 15px 20px; opacity:0.7; border-bottom:1px solid #d4d4d4; min-height:52px; } #loopedSlider ul.pagination li a:hover { opacity:1; background:#eee; } #loopedSlider ul.pagination li.active a { opacity:1; background:#eee;} #loopedSlider ul.pagination img { background:#fff; padding:2px; border:1px solid #d1d1d1; float:left; margin-right:10px;} #loopedSlider ul.pagination em { color:#555; font-family:Georgia, serif; font-weight:bold; line-height:18px; margin-top:10px; font-style:normal; } #loopedSlider ul.pagination .meta { display:block; font-size:11px; color:#777; line-height:16px; margin:5px 0 0 64px; } /*-------------------------------------------------------------------------------------------*/ /* 3. POSTS */ /*-------------------------------------------------------------------------------------------*/ #breadcrumb {} .archive_header { display: block; padding:10px 20px 0; margin:0 0 15px; font-size: 18px; font-weight: bold; background:url(images/bg-widget-title.png) repeat-x; height:33px; } .archive_header .cat { } .archive_header .catrss { background:url(images/ico-rss.png) no-repeat 2px; } .archive_header .catrss a { font-size: 14px; text-decoration: none; line-height: 22px; margin-left:35px; } .box { background:#fefefe url(images/bg-box.png) repeat-x; margin: 0 0 20px 0;} .post { padding:25px 25px 20px; border:1px solid #fff; position:relative; } .post-bottom { background:#E4E4E4 url(images/bg-post-bottom.png) repeat-x top; line-height:44px; padding:0px 25px; border-bottom: 1px solid #B9B9B9; border-top: 1px solid #DBDBDB; } .post-bottom div, .post-bottom div a { color:#777; font-family:Verdana, Geneva, sans-serif; font-size:11px; text-decoration:none; } .post-bottom div a:hover { color:#222; } .post-bottom .cat { background:url(images/ico-cat.png) no-repeat top left; padding:2px 0 2px 25px; height:16px;} .post-bottom .tags { background:url(images/ico-tags.png) no-repeat top left; padding:1px 0 2px 25px; height:16px;} .post .title { margin: 0 0 5px 0; font-weight:100 } .post .title a:link, .post .title a:visited { color:#222; } .post-meta{margin: 0 0 15px 0;font-size:10px;color:#9F9F9F; font-family: Verdana, Geneva, sans-serif; text-transform:uppercase; line-height:11px;} .post-meta a { border-bottom:1px dotted; } .post-meta a:hover { border:none; } .post-meta img { vertical-align:top; margin:0 5px; } .post p.tags{background:url(images/ico-tag.gif) no-repeat center left;padding-left:25px;width:100%;clear:both;} .post .thumbnail { padding:4px; border:1px solid #e2e2e2; background:#fff; margin-top:0; } .post .video { margin-bottom:20px; } .entry { font-size:14px; line-height:20px; } /* 3.1 Typographic Elements */ .entry h1 {} .entry h2 {} .entry h3 {} .entry h4 {} .entry h5 {} .entry h6 {} .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 { margin: 0 0 15px 0; } .entry p { margin: 0 0 15px 0; } .entry blockquote { padding: 10px 30px; color: #666; } .entry blockquote p {} .entry ul { margin: 0 0 15px 0; padding: 0 0 0 30px; } .entry ul ul { margin: 0; } .entry ul li { list-style-type: circle; } .entry ul ul li { list-style-type: disc; } .entry ol { margin: 0 0 15px 0; padding: 0 0 0 30px; } .entry ol ol { margin: 0; } .entry ol li { list-style-type: upper-latin; } .entry ol li ol li { list-style-type: lower-latin; } /* 3.2 Images */ .entry img { padding: 5px; border: 1px solid #ccc; } img.wp-smiley { padding: 0; border: none; } .alignleft { float: left; width: auto; margin: 10px 20px 10px 0; } .alignright { float: right; width: auto; margin: 10px 0 10px 20px; } .aligncenter { text-align: center; margin-bottom:10px; } .wp-caption { padding: 1px; text-align:center; background:#F8F8F4; border: solid 1px #e6e6e6; } .wp-caption img{ margin:0; padding:4px 0; background:none; border:0; } .wp-caption-text { margin:0; padding:0; font-size:11px; text-align:center; } .wp-caption a:hover { border:none !important; } /* 3.3 Pagination / WP-Pagenavi */ .more_entries {font-size:12px; line-height:18px; font-family:Georgia, serif !important; font-style:italic !important;} .more_entries a { display: block; margin: 0; background:#efefef; padding:4px 8px; color:#777; text-shadow: #fff 0px 1px 0px; border:1px solid #ccc;} .more_entries a:hover { background:#ddd; text-shadow: #fff 0px 1px 0px; border:1px solid #ccc;} .more_entries .fl a { background-image:url(images/ico-arrow-left.png); background-repeat:no-repeat; background-position:8px center; padding-left:20px; } .more_entries .fr a { background-image:url(images/ico-arrow-right.png); background-repeat:no-repeat; background-position:95% center; padding-right:20px; } .more_entries .wp-pagenavi { margin: 15px 0 0 0; text-align: right; } .more_entries .wp-pagenavi a:link, .more_entries .wp-pagenavi a:visited { display: inline; text-decoration: none; background: #efefef;color: #777; padding: 4px 8px; border:1px solid #ccc; } .more_entries .wp-pagenavi .current, .more_entries .wp-pagenavi .on, .more_entries .wp-pagenavi a:hover { padding: 4px 8px; background: #ddd; color:#777; text-shadow: #fff 0px 1px 0px; border:1px solid #ccc; } .more_entries .wp-pagenavi .extend, .more_entries .wp-pagenavi span.pages { background: #efefef;color: #777; padding: 4px 8px; text-shadow: #fff 0px 1px 0px; border:1px solid #ccc;} /* 3.7 Buttons / Banners */ .entry a.btn, input.submit { background:url(images/bg-button.png) no-repeat center 0; padding:4px 8px; color:#fff; font:Georgia, serif; font-size:12px; font-style:italic; text-shadow: #777 0px 1px 0px; background-color:#838C1C; border:1px solid #626915; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; } .entry a.btn:hover { cursor:pointer; opacity:0.8; } .post #share { position:relative; height:35px; margin:20px 0 0; padding:1px 0 0 55px; } .post #share .banner { background:url(images/banner-share.png) no-repeat; position:absolute; top:0; left:-40px; width:78px; height:36px; color:#fff; font:bold italic 14px Georgia, serif; text-shadow:#555 0 1px ; line-height:29px; padding:0 0 0 16px;} .post #share a img { padding:0 10px 0 0; opacity:0.7; } .post #share a:hover img { padding:0 10px 0 0; opacity:1; } .featured-banner { background:url(images/banner-featured.png) no-repeat; position:absolute; top:14px; left:-14px; width:100px; height:36px; color:#fff; font:bold italic 14px Georgia, serif; text-shadow:#555 0 1px ; line-height:29px; padding:0 0 0 16px; z-index:99;} /*-------------------------------------------------------------------------------------------*/ /* 4. WIDGETS */ /*-------------------------------------------------------------------------------------------*/ /* 4.2 Generic Widgets */ .widget { position:relative; margin: 0 0 20px 0; background:#fefefe url(images/bg-box.png) repeat-x; padding:0; border:1px solid #fff; color:#555; font-family:Georgia, "Times New Roman", Times, serif; line-height:20px; } .widget h3 { font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:14px; color:#666; margin: 0; padding:14px 15px 0; height:30px; background:url(images/bg-widget-title.png) repeat-x; } .widget .textwidget p { padding: 5px 0; } .widget ul, .widget div, .widget p { padding:0px 15px 10px; } .widget ul { clear:both; margin:5px 0;} .widget ul li { background:url(images/ico-bullet.png) no-repeat 4px 14px; padding-left:20px; border-bottom: 1px solid #ededed; } .widget ul li a { padding:0px 0; line-height: 30px; text-decoration: none; color:#777; } .widget ul li a:hover { color: #000; border-bottom:1px dotted; } .widget ul ul { margin:0; padding:0; border-top: none; } .widget ul ul li { border: none; } .widget_recent_comments li, #twitter li { padding: 6px 0; line-height: 18px; border-bottom: 1px solid #eee; } /* RESET LI STYLING FOR RECENT COMMENT & TWITTER */ .widget_recent_comments li a, #twitter a { display: inline; padding: 0; line-height: 18px !important; } /* RESET <A> STYLING FOR RECENT COMMENT & TWITTER */ .widget_tag_cloud a { color:#777; } .widget_tag_cloud div { padding-top:5px; } #advert_300x250 {background:none; border:none; } #advert_300x250 a:hover {border:none;} #advert_125x125 { padding:18px 0 5px 18px; } #advert_125x125 img { padding:0 8px 8px 0; } #advert_125x125 a:hover {border:none;} /* 4.2 Specific Widgets */ /* WIDGET FORMS */ .widget #searchform { margin: 15px 0 0 15px; } .widget select { margin: 15px 0 15px 15px; } .widget input#s, .widget input.field, .widget select { width: 250px; padding: 3px 0 3px 5px; border: 1px solid #ccc; } .widget input.submit {} .widget .screen-reader-text { display: none; } #search_main form div{position:relative;height:33px;;margin-bottom:25px;} #search_main input.field{ float:left; border: 1px solid;border-top-color: #C5C3C3;border-left-color: #C5C3C3;border-right-color: #EDEDED;border-bottom-color: #EDEDED;background: #fff;font-family:Georgia, "Times New Roman", Times, serif;font-size: 12px;padding: 7px 10px; font-style:italic; margin:0 5px 5px 0; color:#999; width:170px;} #searchform .submit { padding:5px 8px; font-family:Georgia, serif; } #searchform .submit:hover { opacity:0.8; cursor:pointer; } /* FLICKR */ #flickr h3 {} #flickr h3 span{color:#0061D8;} #flickr h3 span span{color:#FF1183;} #flickr .flickr_badge_image { float: left; margin: 0; padding:0; } #flickr .wrap { margin: 10px; position: relative; padding: 0; } #flickr a img { float: left; margin: 5px 0 5px 10px; display: block; border: #CECFC6 1px solid; padding: 3px; width:70px; height:70px; } #flickr a:hover img { border:#A8AA99 1px solid; } /* LIFESTREAM */ .widget_lifestream ul li { border-bottom: 1px solid #e0e6e6; } .widget_lifestream ul li a { border:none; background:none!important; } .widget_lifestream ul .lifestream_meta { color: inherit; } /* CALENDAR */ #wp-calendar{width:95%;margin-bottom:15px;clear:both;padding:0;} #wp-calendar caption{padding:10px;} #wp-calendar th,#wp-calendar td{text-align:center;background:#E7E7E7;color:#9E9E9E;padding:5px;} #wp-calendar td{background:transparent;} #wp-calendar td,table#wp-calendar th{padding:3px 0;} /* AUTHOR */ #author .widget_title img { vertical-align:top; margin-right:10px; margin-top:-2px; } #author .wrap { padding:10px 5px; } #author img.avatar { padding:2px; background:#fff; border:1px solid #ddd; } #author .author-info { float:left; width:190px; font-family:Verdana, Geneva, sans-serif; font-size:10px; text-transform:uppercase; line-height:16px; padding:2px 0 0 0px; color:#777; } #author .author-desc { font-style:italic; } /* 4.3 Sidebar Tabs */ #tabs { background:#FEFEFE url(images/bg-box.png) repeat-x;; height:auto !important; border:1px solid #fff;display: block; } #tabs .inside { padding:5px !important;padding: 2px; padding-top:0 !important; } #tabs ul.wooTabs { height:53px !important; background: url(images/bg-widget-title.png) repeat-x center top; padding:0 10px; } #tabs ul.wooTabs li { float: left; display:inline;font-family:Verdana, Geneva, sans-serif; font-size: 10px; color: #ffffff; margin:0px 1px 0px 0px !important; cursor: pointer; } #tabs ul.wooTabs li a.selected, #tabs ul.wooTabs li a:hover { color:#838C1C; text-decoration:none; background:url(images/bg-tabs-selected.png) no-repeat center 41px; } #tabs ul.wooTabs li a { color:#777; line-height: 42px; display: block;float: left;padding: 0 10px 10px; text-transform:uppercase; } #tabs #tagcloud, #tabs .inside li { padding:10px; font-family:Georgia, serif;} #tabs .inside ul { margin:0 5px 5px; } #tabs .inside li { border-bottom:1px solid #EDEDED } #tabs .inside li a { color:#555; font-weight:bold; line-height:20px; line-height:18px; } #tabs .inside a:hover{ border-bottom:1px dotted;} #tabs .inside li span.meta { display:block; font-size:10px; text-transform:uppercase; color:#777; font-family:Verdana, Geneva, sans-serif; line-height:20px; } #tabs .inside li img.avatar, #tabs .inside li img.thumbnail { border: 1px solid #ddd; padding: 2px; background-color: #ffffff; float: left; margin: 0 8px 0 0; } /* 4.4 Sidebar Video */ #video .inside { padding:0; } #video .inside div { padding:7px; } #video ul.wooTabs { margin:0; padding:0 14px 5px; } #video ul.wooTabs li { background:#fafafa; border:1px solid #eee; padding:0 10px; margin-bottom:5px; } /*-------------------------------------------------------------------------------------------*/ /* 5. COMMENTS */ /*-------------------------------------------------------------------------------------------*/ /* 5.1 Comments */ #comments {background:#ececec; border-top:1px solid #f5f5f5; border-bottom: 1px solid #dadada; position:relative;margin-top:20px;padding:25px 25px 20px;} #comments h3{ font-size:16px; color:#777; padding-bottom:10px; } #comments .comment{margin-top:10px;width:100%;list-style-type:none;} #comments .avatar { float: left; } #comments img.avatar { background:#fff; padding:4px; border:1px solid #ddd; } #comments .comment-right { margin-left: 95px; } #comments .comment .comment-container { padding: 3px 0; } #comments .comment-head { background:#e4e4e4 url(images/bg-comment-head.png) repeat-x bottom; border:1px solid #d8d8d8; height:40px; line-height:40px; padding:0 15px;margin: 0; } #comments .comment-head .name { font-family:Georgia, serif; font-style:italic; margin: 0 0 -5px 0; font-weight: bold; font-size: 12px; } #comments .comment-head .date { margin-right:10px; } #comments .comment-head .date a, #comments .comment-head .edit { font-size: 11px; color:#777; } #comments .comment-entry { background:#fff; border:1px solid #d8d8d8; color:#555; padding:20px 15px 10px 15px; border-width:0 1px 1px 1px; font-size:14px; line-height:20px; } #comments .comment-entry p { margin: 0 0 10px 0;} #comments ul.children{background: url(images/ico-comment-reply.png) no-repeat 0 25px; padding:0 0 0 25px;margin:0;} #comments .cancel-comment-reply{margin-bottom:10px;} #comments .navigation { } #comments .navigation a{ display: block; margin: 15px 0 0 0; text-decoration: none; } #comments .navigation a:hover{} #comments a.comment-reply-link { background:url(images/bg-button.png) no-repeat center 0; padding:2px 6px; color:#fff; font:Georgia, serif; font-size:12px; font-style:italic; text-shadow: #777 0px 1px 0px; background-color:#aaa; border:1px solid #999; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; } #comments a.comment-reply-link:hover { cursor:pointer; opacity:0.8; } /* 5.2 Comments Form */ #respond { background:#ececec; border-top:1px solid #f5f5f5; margin: 0; padding:25px 25px 20px; border-bottom: 1px solid #bbb;} #comments #respond { padding:20px 0; } #respond h3 { font-size:16px; color:#777; padding-bottom:10px; } #respond .left { float:left; width:200px; } #respond .right { float:left; width:380px; } #commentform { margin: 15px 0 0 0; font-family:Arial, Helvetica, sans-serif; } #commentform input.txt { color:#555;width:180px; margin: 0 5px 10px 0; padding: 7px 5px; border: 1px solid #eee; } #commentform textarea { color:#555;width: 95%!important; padding: 5px; border: 1px solid #eee; } #commentform #submit { margin: 15px 0 0 0; } #commentform input.txt, #commentform textarea { border: 1px solid;border-top-color: #C5C3C3;border-left-color: #C5C3C3;border-right-color: #EDEDED;border-bottom-color: #EDEDED; } #commentform #submit { font-family:Georgia, serif; background:url(images/bg-button.png) no-repeat center 0; padding:4px 8px; color:#fff; font:Georgia, serif; font-weight:bold; font-size:12px; font-style:italic; text-shadow: #555 0px 1px; background-color:#6694ac; border:1px solid #557c90; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; } #commentform #submit:hover { cursor:pointer; opacity:0.8; } /* 5.2 Pingbacks / Trackbacks */ h3#pings { margin: 20px 0 10px 0; } .pinglist li { margin: 0 0 0 20px; list-style-type: decimal; } .pinglist li .author { font-weight: bold; font-size: 15px; } .pinglist li .date { font-size: 11px; } .pinglist li .pingcontent { display: block; margin: 10px 0; } /*-------------------------------------------------------------------------------------------*/ /* 6. MISC */ /*-------------------------------------------------------------------------------------------*/ #lbCenter, #lbBottomContainer{ z-index:9999 !important; } #lbOverlay { z-index:9998 !important; } Similar TutorialsHey Guys I am new to CCS. I started a blog about 2 weeks ago and I am using a domain/host with WordPress installed. I have a premium theme. I am very happy with the theme but I do not like the color/type/size of the contents font. I went into theme editor > stylesheet and began looking for something that would tell me where the code for the content would be. I changed the first few colors, refreshed the page and nothing changed. I did this about 20 times.... and I still can't find the code for the font! Please Help! Original Style Sheet Code: Code: body { background:#083550 url(images/bg_main.jpg) repeat-x top; font:12px Arial, Helvetica, sans-serif; padding:0; margin:0; color:#101010;} html { padding:0; margin:0;} a { text-decoration:none; color:#292929; border:0;} a:hover { text-decoration:underline; color:#292929; border:0;} a:focus { outline:none;} .clr { clear:both;} h1, h2, h3, h4 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;} img { padding:0; margin:0; border:none; text-align:center;} hr1 { border-left:0 solid #000000; border-right:0 solid #000000; border-top:0 dotted #000000; border-bottom:1px solid #000000; height :1px;} hr { border-left:0 solid #7f262e; border-right:0 solid #7f262e; border-top:0 dotted #7f262e; border-bottom:1px solid #7f262e; height :1px;} form { padding:0; margin:0;} input { font-family:'Verdana'; color:#282b31; font-size:11px;} textarea { font-family:'Verdana'; color:#282b31; font-size:11px;} select { font-family:'Verdana'; color:#282b31; font-size:11px;} /* Header +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ #bgcontainer { margin:0; padding:0; background:url(images/bg_top.jpg) no-repeat top;} .bgRasize { width:1024px; margin:0 auto; padding:0;} /**/ * html .Header { height:197px;} /* */ .Header { width:1024px; margin:0; padding:0; height:197px;} /* Menu ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ + */ .Menu { padding:0; margin:0; height:50px; width:1024px; float: left;} .Menu ul { list-style:none; margin:0; padding:0; height:50px;} .Menu ul li { padding:17px 0 0 0; margin:0; float:left; line-height:14px;} .Menu ul li a { padding:5px 15px 5px 20px; margin:0; outline:0; background:none; font:normal 12px Georgia, "Times New Roman", Times, serif; color:#50bed2; text-transform:uppercase;} .Menu ul li a:hover { font:normal 12px Georgia, "Times New Roman", Times, serif; color:#d9d9d9; text-decoration: underline;} .Logo { width:1024px; height:147px; margin:0; padding:0;} .LogoText h1 {letter-spacing:-2px; padding:15px 0 5px 0; margin:0; font:normal 36px Georgia, "Times New Roman", Times, serif; color:#fff; text-align:center; text-transform:uppercase;} .LogoText a { color:#ffffff; text-decoration:none;} .LogoText a:visited { color:#ffffff; text-decoration:none;} .LogoText a:hover { color:#ffffff; text-decoration:none;} .Desc { color:#92dffd; line-height:12px; font:normal 14px Georgia, "Times New Roman", Times, serif; padding:0; margin:0; text-align:center; text-transform:uppercase;} /* Syndicat ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ + */ .Syn { width:325px; height:51px; padding:0; margin:0 0 0 10px; background: url(images/rss.gif) 0px 5px no-repeat; float:left; border-right:1px solid #fff;} .Syn ul { margin:0; padding:5px 0 0 50px;} .Syn li { margin:0; padding:0; list-style-type:none; color:#1e8baa; font:bold 18px Arial, Helvetica, sans-serif;} .Syn li.text { color:#fffefe; font:normal 10px Arial, Helvetica, sans-serif;} .Syn li a { color:#1e8baa; font:bold 18px Arial, Helvetica, sans-serif; text-decoration:underline;} .Syn li a:visited { color:#1e8baa;} .Syn li a:hover { color:#1e8baa;} /* Syndicat ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ + */ .twit { width:300px; height:51px; padding:0; margin:0 0 0 10px; background: url(images/twitter.gif) 0px 5px no-repeat; float:left; border-right:1px solid #fff;} .twit ul { margin:0; padding:5px 0 0 50px;} .twit li { margin:0; padding:0; list-style-type:none; color:#1e8baa; font:bold 18px Arial, Helvetica, sans-serif;} .twit li.text { color:#fffefe; font:normal 10px Arial, Helvetica, sans-serif;} .twit li a { color:#1e8baa; font:bold 18px Arial, Helvetica, sans-serif; text-decoration:underline;} .twit li a:visited { color:#1e8baa;} .twit li a:hover { color:#1e8baa;} /* Search ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ /**/ * html .Search {} /**/ .Search { width:300px; padding:0; margin:0 0 0 10px; float:left; height:51px; border-right:1px solid #fff;} .Search form { padding:10px 5px 0 5px;} .Search h2 { padding:5px 20px; color:#979797; font:bold 18px Tahoma, Arial; margin:0; background:url(images/bg_searth_h2.gif) left no-repeat;} .Search input { color:#ffffff;} .Search input.keyword {border:1px solid #b4b4b4; width:190px; color:#b4b4b4; padding:6px 10px; height:15px; float:left;} .Search input.search { border:none; background: url(images/search.gif) top no-repeat; height:30px; width:30px; padding:0; margin:0 5px; float:left;} /* Container +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .CON { width:1024px; padding:0; margin:0; background:#fff;} /* Side Central +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .SC { width:570px; padding:20px; margin:0; float:left; font:normal 11px Georgia, "Times New Roman", Times, serif; color:#888888;} .SC p { padding:5px; margin:5px 0;} /* Post +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .pagetitle { color:#848484; font:normal 26px Georgia, "Times New Roman", Times, serif;} .Post {padding:10px; margin:0 0 10px 0; border:1px solid #ededed; background:#f6f6f6;} .PostHead { padding:0; margin:0;} .PostHead h2 {color:#2e2e2e; font:bold 20px Arial, Helvetica, sans-serif; margin:0; padding:10px 0;} .PostHead h2 a { color:#2e2e2e; text-decoration: none;} .PostHead h2 a:visited { color:#2e2e2e; text-decoration:none;} .PostHead h2 a:hover { color:#2e2e2e; text-decoration: none;} /**/ * html .PostTime {} /**/ .PostTime { padding:5px 0 5px 10px; font:normal 11px Georgia, "Times New Roman", Times, serif; color:#fff; margin:0; background:url(images/bg_post_time.gif) top repeat-x;} .PostTime strong { font:normal 11px Georgia, "Times New Roman", Times, serif; color:#fff;} .PostTime .day { font-size:11px;} .PostTime .month { font-size:11px;} .PostTime .year { font-size:11px;} .PostTime a { font:bold 11px Georgia, "Times New Roman", Times, serif; color:#fff; text-decoration:underline;} .PostContent a { color:#989898; text-decoration:underline;} .PostContent a:hover { color:#989898; text-decoration:none;} .PostContent img { margin:0; padding:0;} .PostContent ol { padding:10px 0 10px 25px; margin:0;} .PostContent ol li { padding:2px 0 2px 0; font-size:12px; line-height:15px; color:#989898;} .PostContent ul { padding:5px 0; margin:0; float:left; width:45%;} .PostContent ul li { padding:2px 0 2px 15px; list-style-type:none; font-size:11px; line-height:15px; color:#989898;} .PostContent blockquote { padding:10px; margin:0; color:#989898; background:#000;} .PostContent blockquote p { font-size:12px; padding:0; margin:0; line-height:15px;} .PostContent blockquote li { padding:2px 0 2px 15px; list-style-type:none; font-size:12px; line-height:15px;} .PostContent blockquote a { color:#989898;} .PostContent blockquote a:visited { color:#989898;} .PostContent blockquote a:hover { color:#989898; text-decoration:underline;} .PostContent strong { color:#373737; font:normal 12px Arial, Helvetica, sans-serif; text-transform:uppercase;} /**/ * html .PostContent p img {} /* */ .PostContent p img { max-width:350px;} .PostContent img { margin:0 10px 10px 0; float:left; background:#0d0e09; padding:3px; border:1px solid #a3a3a3;} .PostCom { padding:10px; font:normal 11px Arial, Helvetica, sans-serif; color:#797979; margin:0; background:url(images/bg_com.gif) left no-repeat;} .PostCom ul { padding:0 10px; margin:0;} .PostCom li { padding:5px 0; margin:0; list-style-type: none; color:#797979; font: normal 11px Arial, Helvetica, sans-serif; display: inline;} .PostCom li a { font-weight:normal; text-decoration:none; color:#797979;} .PostCom li a:hover { font-weight:normal; text-decoration: underline; color:#797979;} .PostCom .Com {} .PostCom .Tags { padding-left:10px;} /* Note ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ .Note { padding:0; margin:0;} .Note li { padding:3px 0 3px 15px; margin:0; list-style-type:none; font-size:12px;} /* TrackbackList ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ .TrackList { background:#848484; padding:15px; margin-top:20px; position:relative;} .TrackListTop { background:#848484; position:absolute; top:0; left:0; width:455px; height:10px;} .TrackList h3 { font-size:14px; font-weight:bold; margin:0 0 5px 0; padding:0 0 5px 0; color:#333366; letter-spacing:-1px; border-bottom:dashed 1px #beb4c1;} .TrackList ul { padding:0; margin:0;} .TrackList li { padding:0 0 0 10px; margin:0; list-style-type:none; font-size:11px;} .TrackList li a { color:#cc3366;} /* Navigation - PlugIn +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .Nav { font-size:11px; padding:10px 0; color:#848484; font-family:'Verdana';} .Nav a { padding:1px 6px 1px 4px; border-right:solid 1px #666; font-size:11px;} .Nav a:visited { padding:1px 6px 1px 4px; border-right:solid 1px #666;} .Nav a:hover { padding:1px 6px 1px 4px; border-right:solid 1px #666; text-decoration:none;} .Nav span { padding:1px 6px 1px 4px; color:#666; border-right:solid 1px #666;} .Nav .on { padding:1px 6px 1px 4px; border-right:solid 1px #666; font-size:11px; color:#003366;} /* Comments ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .Comments { margin:20px 0 0 0; position:relative;} .Comments h3 { font-size:16px; letter-spacing:-1px; margin:0 0 5px 0; padding:10px 0; color:#848484; border-bottom:solid 2px #660000;} /* Comments List ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .List ol { padding:0; margin:0;} .List li { position:relative; padding:5px 0; margin:10px 0; list-style-type:none;} /**/ * html .List .LGrav { right:30px;} /* */ .List .LGrav { position:absolute; right:0; top:10px;} .List .LGrav img { border:solid 1px #ccc; padding:2px; background:#fff;} .List .LUsr { margin:0; padding:0; font-size:11px; line-height:12px; color:#999;} .List .LUsr a { color:#999; text-decoration:none;} .List .LUsr strong { font:bold 16px "Trebuchet MS", sans-serif; letter-spacing:-1px; color:#666;} .List .LUsr strong a { color:#cc0000; text-decoration:none;} .List .LCon { margin:10px 0 0 0 ; padding:0; font-size:12px; line-height:16px; border-top:solid 1px #ccc;} .List .LCon p { margin:0; padding:5px 0 ; font-size:12px; line-height:16px;} .List .Author { background:#fff;} /* Comments Form ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .Form .Email {} .Form { padding:0 0 10px 0 ; position:relative; margin:0; font-family:'Verdana';} .Form form { margin:0; padding:0;} .Form a { text-decoration:underline;} .Form p { padding:0 0 2px 0 ; margin:0; color:#666;} .Form p small strong { font-weight:bold; color:#FF3300;} .Form p small { font-size:11px; display:block; padding:6px 0 ; color:#000;} .Form .TextField { color:#003366; background:#e9f8ff; border:solid 1px #d5e7f0; padding:6px 6px 6px 30px; font-size:12px; display:block;} .Form .TextArea { color:#003366; background:#e9f8ff; border:solid 1px #d5e7f0; padding:6px; font-size:12px;} /* Side Right +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .SR { width:394px; padding:20px 20px 20px 0; margin:0; float:right;} /* Banners ADs ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .banner {padding:10px; margin:0; border:1px solid #ededed; background:#f6f6f6;} .banner h2 { text-transform:uppercase; text-decoration:underline; border-bottom: 1px solid #ccc; color:#6b6b6b; font:bold 12px Arial, Helvetica, sans-serif; margin:10px; padding:5px 20px;} .banner ul { margin:0; padding:0 0 0 10px; list-style:none;} .banner li { margin:0; padding:5px 10px; float:left;} .banner li img { } /* Side Right Right +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .SRR {padding:0; margin:10px 0;} .SRR div.categories, .SRR div.archives, .SRR div.meta { width:50%; float:left; margin:0; padding:0;} .SRR h2 { text-transform:uppercase; text-decoration:underline; border-bottom: 1px solid #ccc; color:#6b6b6b; font:bold 12px Arial, Helvetica, sans-serif; margin:10px; padding:5px 20px;} .SRR ul { padding:5px 15px; margin:0; list-style:none;} .SRR li {padding: 5px 0 5px 20px; font:normal 12px Georgia, "Times New Roman", Times, serif; color: #b4b4b4; border-bottom:1px solid #ededed; background:url(images/categories_li.gif) left no-repeat;} .SRR a { font:normal 12px Georgia, "Times New Roman", Times, serif; color: #b4b4b4; text-transform:uppercase;} .SRR a:hover { text-decoration:underline; color:#10547e;} /* Flickrrss ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .widget { padding:10px; margin:10px 0; border:1px solid #ededed; background:#f6f6f6;} .widget h2 { text-transform:uppercase; text-decoration:underline; border-bottom:1px solid #ccc; color:#6b6b6b; font:bold 12px Arial, Helvetica, sans-serif; margin:10px; padding:5px 10px;} .widget ul { padding:10px; margin:0;} .widget li { margin:0; padding:5px 10px 4px 20px; list-style-type:none; border-bottom:1px solid #ededed; color:#999999; background:url(images/categories_li.gif) left no-repeat;} .widget li a { margin:0; padding:0; border:0; background:none; color:#10547e; text-decoration:underline;} .widget li a:hover { text-decoration:none;} /* Flickrrss ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .widget_flickr { border:0; background:none;} .widget_flickr h2 { } .widget_flickr ul { margin:0; padding:0 0 10px 5px; text-align:center;} .widget_flickr li { margin:0; padding:0 5px 0 0; list-style-type:none; display:inline; background:none;} .widget_flickr li a img { background:#000; padding:0; margin:0 5px 5px 0; width:65px;} .widget_flickr li a:hover img { padding:0;} /* Footer ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .FBG { margin:0; padding:0; } .Footer { padding:10px 0; margin:0; text-align:center; background:none;} .Footer p { color:#56b1d5; padding:0; margin:0; font:normal 11px Arial, Helvetica, sans-serif;} .Footer a { color:#56b1d5; text-decoration:underline;} <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- div.print { font-family: Arial, Helvetica, sans-serif; font-size: 2pt; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; color: #FF3300; letter-spacing: normal; word-spacing: normal; } div.regular{ font-family: "Times New Roman", Times, serif; font-size: larger; font-style: normal; line-height: normal; font-weight: bold; font-variant: normal; text-transform: none; color:#006600; letter-spacing: normal; word-spacing: normal; text-decoration: underline; } --> </style> <script language="JavaScript"> function printerFriendly() { document.getElementById('div1').className = 'print'; } </script> </head> <body> <p><a href="javascriptrinterFriendly()">click here to change font</a></p> <div id="div1" class="regular"> <table id="tab1" width="100%" border="0" cellspacing="1" cellpadding="1"> <tr> <td>bla</td> <td>kla</td> <td>sal</td> <td>kdef</td> </tr> <tr> <td>iuwhdfqower</td> <td>ouresgopu</td> <td>uihwdrfpu</td> <td>uiwrhgfpuieroi</td> </tr> <tr> <td>oiiudefpuiwerv</td> <td>iufdgpiuwqerpoi</td> <td>iuergpuergipou</td> <td> </td> </tr> </table> <p class="print"> </p> </div> </body> </html> why is the font size not changing nor the color?? only the font changes when th link is clicked?? I am creating a website that uses English and Japanese characters. The default font size I use for English characters displays the Japanese characters too small. I would like the Japanese characters to display in a certain size whenever and wherever they appear. I can't simply use classes because I have English and Japanese appearing in the same elements a lot of the time. Any help would be greatly appreciated. Thank you. Is there any way to get peoples "recent posts" from a forum (for example; SimpleMachines-forums) listed on your own website? I would like the simplest technique, and I would not like to have to install something to do this. Are there any CSS (or HTML) codes for this without using php (or a plugin)? I would really appreciate an answer I have a button which is drawn using css background-image and it has a hover effect using css a:hover. I also need to have a click state for this button, so that each time the button is clicked it switches between two different states (4 states total). Is this possible? I'm assuming this will probably require JavaScript which I have little experience. Thanks in advance for any help! Dear Friends, I have been trying to make a stupid title bar, that i did with tables, now using css. This is what the code for a titlebar looks like in table form: <table width="100%" border="0" cellpadding="0" cellspacing="0"> <TR> <TD width="10"> <img src="img_inside_article_title-bar_left.gif" width="10" height="30"></TD> <TD colspan=2 height="30" background="tile_inside_article_titlebar_bak.gif"> <p class="left"> <span class="strong_white"> Title</span></p></TD> <TD width="14"> <img src="img_inside_article_title-bar_right.gif" width="10" height="30"></TD> </TR> </table> and would like to convert it into css. All my attempts have been very wrong, and i need help. I'd give my css code, but it is sooo wrong.......that it would be better to start from scratch. basically this is the idea: (Left Corner Image)(Title area that streaches across width of web page)(Right Corner Image) HELP Fz105 Hi. Is there any way to: a) Change background color of the title box that appears when you hover over an image AND b) Reduce the delay it takes to appear? Thanks. Excuse me, I'm currently designing a website (Freelance) and I would like to know how to change the color of the title. I would like to have the Title a different color. I would like to know if I could change it to get the title a different color than the Box so it will stand out more. If it is not clear I shall provide an image of what I would like to do and please provide me with Tips or Suggestions of What I should do. h tt p:/ /i125.photobucket.com/albums/p61/lazypuffstone/help.png EDIT: I apologize I did not give you the Coding .contentbox1 { width: 675px; border: solid #7A6A53; border-width: 1px 1px 1px 1px; background-color: #D5DED9; } .contentbox1 ul li { margin: 20px 20px 30px 0px; background-color: #D5DED9; list-style-type: none; } Hi, is there a method of setting the color for title="some text" in a hyperlink ? e.g. [<a href="index.php?page=links.php" title="Redlake Valley business websites">Local Links</a>] TIA Mike The title attribute will display black text in a yellow box on the mouse over of an element. Take this code: Code: <a href='#' title='This should be a different background color or something'>text link</a> I want to have the title attribute display with a different background color, different font color and font size. I was wondering how I might use CSS to get into this attribute and do some editing. Thanks in advance, Taylor Hello Everybody, I am trying to figure out why IE is cutting off the foot of my title. It works just fine in firefox. I tried setting a height and it showed the bottom but cutoff the top. If anyone has any suggestions as to why IE is cutting off the bottom I would be very thankful. Website with Title cut off at bottom Can you style the tooltip box that pops up on hover over an object with the 'title' attrib set? If so how? Hours of googling have only led to some fairly complex DHTML/Java solutions that I don't like the look of. Cheers, John. I'm customizing an IP Board (version 3.2.1). I've set up a test board and when I've got it how I want it I'm going to export it as a skin which I'll install on a live board. In the current version of IP Board, the post title is above the main title bar in post view, whereas in the previous version, the post title was in the main title bar, which is where I want it. One of the IPB boffins gave me a code mod which enabled me to place the post title in the main title bar. The problem is the standard code that governs the post title also governs the forum title (pictured below) in forum view. I need to get rid of this title (circled) in order to reduce some of the space between the header and the main title bar. But if I comment out this title, I also comment out the post title. According to the guy who was helping me, the only way around this is to create a new class, which is beyond his expertise -- and way beyond mine. How do I do this, or is there an alternative and hopefully simpler solution? Many thanks! This is the code in question. Code: .ipsType_pagetitle, .ipsType_subtitle { font: 300 16px/1.3 Helvetica, Arial, sans-serif; color: #141719;} The circled title is what I want to remove. http://www.thechristianidentityforum.net/smf/pix/screenshot.jpg The code also affects the post title in post view, which is why I need a new rule set/class, so I can delete the forum title in forum view but not the post title. http://www.thechristianidentityforum.net/smf/pix/screenshot2.png EDIT: For some reason the images won't display in the post. They display in preview but not when posted. Just click on the urls to see the pix. I apologize if I've broken a forum rule or two in doing this. I need to get the data/decription for the title which are stored in a database using mouse over or click.Any Idea?How to? Can someone please tell me how I can add a title/text to the top left portion of my website? I'd like it to be a title of sorts to fill in the dark gap above the navigation tabs. Thank you in advance for any suggestions... the site is northwestpahealthcare.blogspot.com I want to place the page title on the left and the pages logo on the right of the page. The logo must be directly accross from the title. Can anyone suggest some CSS and html Below is my feeble attempt HTML: <div id="header"> <p>Report Title <span class="logo"><img src="logo.gif"> </span> </p> </div> CSS: #header p { text-align: left; } #header .logo { text-align: right; } Hello experts! I would like to style the font, background-color and border (possibly more) for those little yellow boxes that appear when you hover over an element with the ALT or TITLE attribute set. Is there a default/built in selector for these, or does it require a round-about method? A lot of people have been asking about this at work I'd love to be the first to find the answer (with your help of course)! My content and navigation bars, though set to 100%, are actually 100% (of the body/html element) plus 100 pixels (their "top" property). If I set their "top" property to 0, they fit the page perfectly but I need them below the title banner. Is there a way to make the 100% height value of these two columns relative to the fixed height of the title banner? Note: One solution was to set their "bottom" properties to 0px. This does not work in IE so it's not a valid option. Also, I do not have the option of setting the navigation's and content's divs to a "top" value of 0 and rasing the title banner's z-index to cover them as I need the overflow scroll bars to extend from the bottom of the title banner to the bottom of the page and not from the top of the page to the bottom of the page. (think frameset ) Code: <!DOCTYPE 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"> <head> <title>100% Height - CSS Problem</title> <style> html { height:100%; } body { height:100%; padding:0px; margin:0px; background-color:#CCCCCC; } #title_banner { display:block; position:absolute; width:600px; height:100px; left:0px; top:0px; background-color:#CC6666; } #navigation { display:block; position:absolute; width:140px; height:100%; left:0px; top:100px; background-color:#66CC66; overflow:auto; } #page { display:block; position:absolute; top:100px; left:140px; width:460px; height:100%; background-color:#6666CC; overflow:auto; } </style> </head> <body> <div id="title_banner"> Set width and heighth title banner image. </div> <div id="navigation"> Navigation links. </div> <div id="page"> Page content. </div> </body> </html> I'd appreciate any links you can share as well. All of the tutorials I've seen for 100% high pages do not include a horizontal, fixed-height banner across the top. I'm using wordpress 2.9 and I installed a plugin called wp-polls the problem is that the Y in Yes and N in No on the poll won't show up in IE. the url is mcs.assistui.net How do you fix this? Here is the blog page: wavgirl.com/blog If you open it in firefox or other browsers, it works fine. The menu at the top is on all pages on my site (via a php include). All pages also are linked to a main stylesheet for my website. Everything works in internet explorer EXCEPT that blog page (if you go to the main page of my site in IE, it loads fine). This has led me to conclude that there is something specifically in the blog's style sheet that doesn't work in IE. When you load the blog page in IE, the page is thrown off center, and the menu dropdown does not work anymore. Can someone simply look at this stylesheet and tell me how to correct it for internet explorer? As I said, all of this loads fine in other browsers, and the menu works on all other pages of the site in any browser. Any help would be appreciated, and I apologize if I posted this in the wrong place. Code: /* Theme Name: Simple Blog Design Theme URI: Description: A simple clear theme with 2-sidebar and 3-sidebar layouts. Version: 1.0 Author: BlogDesignStudio Author URI: http://blogdesignstudio.com/ Tags: widget ready, white, blue, right sidebar Valid XHTML 1.0 Transitional */ * { margin: 0; padding: 0; } body { color: #000; background: #fff; font-family: Verdana, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif; font-size: 70%; line-height: 1.6; } p { font-size: 1.1em; margin: 0 0 10px 0; } blockquote { background: url(images/quote.png) no-repeat; color: #000; margin: 15px; padding-left: 25px; } em { font-style: italic; } strong { font-weight: 700; } pre, code { font-family: Verdana, "Courier New", Courier, Monospace; line-height: 1.5; } pre { border-top: 1px solid #ccc; white-space: pre; overflow: auto; margin: 0 15px; padding: 10px 15px; max-height: 300px; } img { } a { color: #555555!important; text-decoration: none; outline: none; } a:focus, a:hover { color: #555555!important; text-decoration: none; } .clear { float:none; clear: both; } .aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; } .alignleft { float: left; } .alignright { float: right; } .wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; } .wp-caption img { margin: 0; padding: 0; border: 0 none; } .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; } img.alignleft { margin:5px 10px 10px 0; } img.alignright { margin:5px 0 10px 10px; } hr { background: #E6E6D2; color: #E6E6D2; clear: both; float: none; width: 100%; height: .1em; margin: 0 0 1.4em; border: none; } hr.space { height: 4em; } .clearer { clear:both; } /************************* HOLDERS ********************************/ .container { text-align: left; background: #fff; min-height: 100%; max-width: 1000px; padding-left: 20px; padding-right: 20px; margin: 0; margin: 0 auto; } .container2 { width: 100%; margin: 0 auto; text-align:left; } /************************* HEADER ********************************/ .blender { background: #eae0da; } #header { width: 100%; } #header .container { width: 980px; } #headline { float:left; margin:15px 0 20px 20px; font-size:16px; color:#a6a379; } #headline h1 { font-size:40px; line-height:40px; margin:0; color:#3e4b54; letter-spacing:-1px; } /************************* SUBSCRIBE START ********************************/ .subs { display:block; float:right; width:280px; } .subs a { margin:10px 0 0 0; padding:0 0 0 25px; height:20px; display:block; float:left; background:url(images/rss.gif) left top no-repeat; } /************************* SUBSCRIBE END ********************************/ /************************* PAGES MENU START ********************************/ .topline { height:40px; background:#3E4B54; } ul.menu { width:980px; list-style-type: none; margin: 0px auto; padding:0; font-weight:normal; height:40px; } ul.menu li.page_item { float: left; display: inline; font-size: 18px; margin:0 1px 0 0; padding:0; text-transform:uppercase; } ul.menu li.page_item a { color:#fff!important; display: block; float:left; text-decoration: none; padding:6px 20px 5px 20px; } ul.menu li.page_item a:hover { color: #3e4b54!important; text-decoration:none; background:#E6E2D9; } ul.menu li.current_page_item a { color: #3e4b54!important; text-decoration:none; background:#E6E2D9; } /************************* PAGES MENU END ********************************/ /* Search */ #searchform { padding:0; margin:10px 0 0 0; display:block; float:left; clear:both; width:250px; height:33px; font-size:15px; color:#003e4f; } input#s { width: 240px; float:left; margin:5px 7px 0 0; padding:4px 5px 6px 5px; font-family: Verdana, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif; border:none; font-size:14px; background:#fff; color:white; } /************************* CONTENT PACKER ********************************/ #leftcolumn, #rightcolumn { margin:0; } #leftcolumn { float: left; width: 70%; padding:0; } #leftcolumn_top { height:6px; margin-bottom:15px; } #leftcolumn_bot { height:6px; margin-top:30px; } #rightcolumn { float: right; width: 29%; margin:0; } .sidebar_left { display:none; } /************************* CONTENT START ********************************/ .title { margin:0; clear:both; } .title h2 { color: #3e4b54; } .title h2 a { color: #3e4b54!important; text-decoration: none; } .title h2 a:hover { color: #3e4b54!important; text-decoration: none; border-bottom:1px dotted #3e4b54!important; } .date { color:#555555; margin-bottom:10px; } .post { padding: 0; margin:0 23px 10px 20px; clear:both; } .post p { padding:0; margin:0; } .postdata { margin: 10px 0 20px 0; padding:0 10px 3px 10px; float:left; font-size:12px; background:#eae0da; color:#000; width:97%; } a.more-link { display:block; clear:both; color:#a6a379; margin:10px 0 20px 0; width:135px; } a:hover.more-link { color:#a6a379; } #related h3, h3#comments { padding: 8px 0 5px 0; border-bottom:1px dotted #999; } .cmd-avatar { clear: none; display: inline; float: right; margin: 0px; } /************************* CONTENT END ********************************/ /************************* SIDEBAR MAINS START ********************************/ ul.sidebar { list-style-type: none; margin: 0 0 0px 0; padding: 0; } .sidebar li { padding:0; margin:0; } li.widget ul { list-style-type: none; margin: 0 0 30px 0; padding: 0; font-size:15px; } .sidebar ul li { margin: 5px 0 5px 0; } .sidebar .children { margin: 0 0 10px 10px; } .sidebar h2 { letter-spacing:-1px; } .sidebar a { color: #000!important; padding:4px 5px 6px 15px; font-size:14px; background-position:0 6px; } .sidebar a:hover { color:#555555!important; background-position:0 6px; } /************************* SIDEBAR MAINS END ********************************/ #tag_cloud { display:block; margin-bottom:30px; float:left; clear:both; width:100%; } ul#recentcomments { width:210px; } ul#recentcomments li { background-position:0 5px; padding-left:15px; } #recentcomments a { background:none; padding-left:0; } #recentcomments a:hover { background:none } #tag_cloud a { margin-right:5px; } /************************* COMMENTS AREA START ********************************/ .commentlist { margin: 0; padding:0; list-style-type:none; } .commentlist p { padding:5px; margin:0; } .komentar { margin:0; padding:0; } .commentlist a { border-bottom:1px dotted; } .commentlist a:hover { text-decoration:none; border-bottom:none; } .commentlist .body { padding: 0; margin:0; overflow: hidden; float:right; width:580px; display:block; text-align:justify; color:#45322f; } .commentlist .body .body-author { padding: 0; margin:0; overflow: hidden; color:#555555; float:left; display:block; } .commentlist .body p { float:left; padding-top:0; } .commentlist li { width: 100%; padding: 0 0 5px 0; clear:both; display:block; float:left; font-size:11px; } .commentlist li .top { color: #45322f; padding: 0; margin:0; width:575px; float:right; font-weight: bold; } .commentlist li .top a { color: #555555; } .commentlist li .top span { font-size: 0.9em; font-weight: 400; color:#505e66; } .gravatar { height:70px; width:60px; float:left; margin:0; } img.avatar { margin:0; height:60px; width:60px; padding:2px; border:1px solid #E5E1DE; } .theform { padding: 1.5em 0 2em; } .theform label { font-size: 0.9em; vertical-align: middle; } #remember, #forget, #txpCommentHelpLink { margin-left: 2em; } #commentform { padding:0; } #commentform input:focus, #commentform textarea:focus { border: 1px solid #CECABE; background: white; } .comment_input { vertical-align: middle; width: 260px; border: 1px solid #ffffff; background: #ffffff; padding: 0.3em; margin-right: 5px; margin-bottom:10px; } .message_input { font-size: 1em; width: 98%; height: 200px; border: 1px solid #CECABE; background: #ffffff; margin-top: 0.2em; margin-bottom:10px; padding: 0.3em; } .commentlist_error { color: #c00; } .button { background: #fff; width:75px; padding:5px 0 5px 0; border:1px solid #CECABE; color:#6000; font-weight:bold; text-transform:uppercase; font-size:12px; cursor:pointer; } .button:hover { background: #555555; color:white; cursor:pointer; } #commentform .button:focus { background: #cccccc; color:white; cursor:pointer; border:1px solid #CECABE; } /************************* COMMENTS AREA END ********************************/ /************************* FOOTER START ********************************/ #footer { width: 992px; margin:0px auto; padding:10px 0 20px 0; display: block; } #footer .container { padding:0; width:950px; } .copyright { float:left; color:#a4a093; font-size:11px; margin-bottom:10px; } #footer .credits { float:left; color:#a4a093; } #footer .credits p { float:left; font-size:12px; margin:6px 5px 0 0; } #footer .credits a, #footer .credits a:visited { text-decoration:none; } a.wordpress { display:block; float:left; width:25px; height:25px; background:url(images/wordpress.gif) no-repeat; color:#ccc!important; padding-left:26px; line-height:30px; } a:hover.wordpress { background:url(images/wordpress.gif) no-repeat 0 100%; color:#000!important; } /************************* FOOTER END ********************************/ /*************** SOCIAL LINKS ************************/ .inside_subpost { display:block; clear:both; margin:30px 23px 30px 20px; padding:0; } .related_rss_icon { float:left; background:url(images/rss.gif) no-repeat; width:25px; height:20px; border-bottom:none; } .related_rss { padding:0; margin:0 0 20px 0; font-size:18px; font-weight:normal; border-bottom:none; } .related_rss a, .related_rss a:visited { border-bottom:1px dotted; } .related_rss a:hover { border-bottom:none; text-decoration:none; } .social { margin:0; padding:0; float:left; margin-right:30px; } /*************** END SOCIAL LINKS ************************/ #calendar_wrap { margin:0px auto; width:210px; margin-bottom:30px; clear:both; } #calendar_wrap a { padding: 3px 0px; background:none } #calendar_wrap table { width: 210px; border: solid 1px #ccc; background:#f7f7f7} #calendar_wrap caption { padding: 5px 0px; width: 210px; color:#585449; font-size:14px; font-weight:bold; } #calendar_wrap table th { text-align: center; letter-spacing: -1px; padding: 0px; font-size:12px; color:#585449; height:30px; } #calendar_wrap table td { text-align: center; border: solid 1px #ccc; padding: 3px; font-size: 12px; color:#585449} #calendar_wrap table td a { font-size: 12px; font-weight:bold;} #calendar_wrap table td a:hover { color:#9CC318; font-weight:bold; border:none; } /* Page Navigation +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .pageNav { padding: 5px 0 0 0; margin:30px 23px 20px 20px; height:30px; font-size:15px; } .pageNav a, .pageNav a:visited { display:block; float:left; text-align:center; line-height:25px; height:25px; width:25px; color:#3A3A3A; text-decoration:none; } .pageNav a:hover { text-decoration: none; color:#a6a379; border-bottom:1px dashed #a6a379; } .pageNav span { display:block; float:left; text-align:center; line-height:25px; height:25px; width:130px; color:#333;} .pageNav .on { display:block; float:left; text-align:center; line-height:25px; height:25px; width:25px; color:#a6a379; } .dotts {width:25px; text-align:center; display:block; float:left;} .pageNav a.lastpage {color: #3a3a3a;width:35px;} .pageNav a:hover.lastpage {color: #222; width:35px;} #singleNav { margin:20px; } .previous { float:left; } .next { float:right; } .list404-table { font-size:17px; } ul.list404, ul.list404 li ul { list-style-type:none; font-size:14px; margin:10px 20px 20px 20px; } ul.list404 li a { background-position:0 4px; padding-left:20px; } ul.list404 li a:hover { background-position:0 4px; } |