SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Zealot
    Join Date
    Oct 2006
    Posts
    113
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Diff a:link, a:hover etc for seperate containers...

    Code:
    a:link, a:visited {
    	color: #BFE4FF; text-decoration: none;
    	font-weight: bold;
    }
    
    a:hover {
    	color: #80C9FF;	text-decoration: underline;
    	font-weight: bold;
    }
    
    table.contentpaneopen {
      width: 100%;
    	padding: 0px;
    	border-collapse: collapse;
    	border-spacing: 0px;
    	margin: 0px;
    }
    
    table.contentpaneopen td {
       padding-right: 5px;
    }
    
    table.contentpaneopen td.componentheading {
    	padding-left: 4px;
    }
    
    
    
    table.contentpane {
      width: 100%;
    	padding: 0px;
    	border-collapse: collapse;
    	border-spacing: 0px;
    	margin: 0px;
    }
    
    table.contentpane td {
    	margin: 0px;
    	padding: 0px;
    }
    
    table.contentpane td.componentheading {
    	padding-left: 4px;
    }
    
    table.contentpaneopen fieldset {
    	border: 0px;
    	border-bottom: 1px solid #eee;
    }
    
    .button {
      color: #000;
      font-family: Arial, Hevlvetica, sans-serif;
      text-align: center;
      font-size: 11px;
      font-weight: bold;
      border: 3px double #80C9FF;
      width: auto;
      background: url(../images/button_bg.png) repeat-x;
      padding: 0px 5px;
      line-height: 18px !important;
      line-height: 16px;
      height: 26px !important;
      height: 24px;
      margin: 1px;
    }
    
    .inputbox {
    	padding: 2px;
    	border:solid 1px #80C9FF;
    	background-color: #ffffff;
    }
    
    .componentheading {
    	background: url(../images/subhead_bg.png) repeat-x;
    	color: #000000;
    	text-align: left;
    	padding-top: 4px;
    	padding-left: 4px;
    	height: 21px;
    	font-weight: bold;
    	font-size: 10px;
    	text-transform: uppercase;
    
    }
    
    .contentcolumn {
    	padding-right: 5px;
    }
    
    .contentheading {
    	height: 30px;
    
    	color: #BFE4FF;
    	font-weight: bold;
    	font-size: 14px;
    	white-space: nowrap;
    }
    
    
    
    .contentpagetitle {
    	font-size: 13px;
    	font-weight: bold;
    	color: #ffffff;
    	text-align:left;
    }
    
    table.searchinto {
    	width: 100%;
    }
    
    table.searchintro td {
    	font-weight: bold;
    }
    
    table.moduletable {
    	width: 100%;
    	margin-bottom: 5px;
    	padding: 0px;
    	border-spacing: 0px;
    	border-collapse: collapse;
    }
    
    div.moduletable {
    	padding: 0;
    	margin-bottom: 2px;
    }
    
    table.moduletable th, div.moduletable h3 {
    	background: url(../images/subhead_bg.png) repeat-x;
    	color: #000;
    	text-align: left;
    	padding-left: 4px;
    	height: 21px;
    	line-height: 21px;
    	font-weight: bold;
    	font-size: 10px;
    	text-transform: uppercase;
    	margin: 0 0 2px 0;
    }
    
    table.moduletable td {
    	font-size: 11px;
    	padding: 0px;
    	margin: 0px;
    	font-weight: normal;
    }
    
    table.pollstableborder td {
      padding: 2px;
    }
    
    .sectiontableheader {
      font-weight: bold;
      color: #000;
      background: #f0f0f0;
      padding: 4px;
    }
    
    .sectiontablefooter {
    
    }
    
    .sectiontableentry1 {
            color: #000;
            background-color : #BFE4FF;
    }
    
    .sectiontableentry2 {
            color: #000;
            background-color : #80C9FF;       
    }
    
    a.sectiontableentry2:link, a.sectiontableentry2:visited {
    color: #000;
    text-decoration: none;
    }
    
    a.sectionableentry2:hover {
    	text-decoration: underline;
    	color: #000;
    }
    
    
    .small {
    	color: #999999;
    	font-size: 11px;
    }
    
    .createdate {
    	height: 15px;
    	padding-bottom: 10px;
    	color: #999999;
    	font-size: 11px;
    }
    
    .modifydate {
    	height: 15px;
    	padding-top: 10px;
    	color: #999999;
    	font-size: 11px;
    }
    
    table.contenttoc {
      border: 1px solid #80C9FF;
      padding: 2px;
      margin-left: 2px;
      margin-bottom: 2px;
    }
    
    table.contenttoc td {
      padding: 2px;
    }
    
    table.contenttoc th {
      background: url(../images/subhead_bg.png) repeat-x;
      color: #666666;
    	text-align: left;
    	padding-top: 2px;
    	padding-left: 4px;
    	height: 21px;
    	font-weight: bold;
    	font-size: 10px;
    	text-transform: uppercase;
    }
    
    a.mainlevel:link, a.mainlevel:visited {
    	display: block;
    	background: url(../images/menu_bg.png) no-repeat;
    	vertical-align: middle;
    	font-size: 11px;
    	font-weight: bold;
    	color: #ccc;
    	text-align: left;
    	padding-top: 5px;
    	padding-left: 18px;
    	height: 20px !important;
    	height: 25px;
    	width: 100%;
    	text-decoration: none;
    }
    
    a.mainlevel:hover {
    	background-position: 0px -25px;
    	text-decoration: none;
    	color: #fff;
    }
    
    a.mainlevel#active_menu {
    	color:#fff;
    	font-weight: bold;
    }
    
    a.mainlevel#active_menu:hover {
    	color: #fff;
    }
    
    a.sublevel:link, a.sublevel:visited {
    	padding-left: 1px;
    	vertical-align: middle;
    	font-size: 11px;
    	font-weight: bold;
    	color: #c64934;
    	text-align: left;
    }
    
    a.sublevel:hover {
    	color: #900;
    	text-decoration: none;
    }
    
    a.sublevel#active_menu {
    	color: #333;
    }
    
    .highlight {
    	background-color: Yellow;
    	color: Blue;
    	padding: 0;
    }
    .code {
    	background-color: #ddd;
    	border: 1px solid #bbb;
    }
    Go here:
    http://www.defstatic.com/joomla/inde...&id=1&Itemid=2

    You will most likely spot my problem right away. You can not or barely can see the links to click on in the table for the news. The table is using what is default for my link attributes for most of the page.

    But for some reason (and you can see in my code I have tried to remedy this) I can not over-ride those links and make them black. Same for my BACK BUTTON, which I think is actually a simular problem.

    Any help would be greatly appreciated.

  2. #2
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    I think your problem is that you have this:
    Code:
    .sectiontableentry2 {
            color: #000;
            background-color : #80C9FF;       
    }
    
    a.sectiontableentry2:link, a.sectiontableentry2:visited {
    color: #000;
    text-decoration: none;
    }
    Those links that you can't see don't have the .sectiontableentry link. Their parent does. What you need to do instead:
    Code:
    .sectiontableentry2 a, .sectiontableentry2 a:visited {
    color: #000;
    text-decoration: none;
    }
    Same sort of thing for your back button I expect.

  3. #3
    SitePoint Zealot
    Join Date
    Oct 2006
    Posts
    113
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I will give that a try. What I had there, iw as trying to copy from another section of the code that appeared to work right, LOL. I also tried entering in each property into each section,with no luck either.

    Off to see if that works. Thanks!

    EDIT: It did work, many thanks!
    Last edited by DefStatic; Feb 8, 2007 at 11:51. Reason: Thanking

  4. #4
    SitePoint Zealot
    Join Date
    Oct 2006
    Posts
    113
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Am I repeating myself in this?

    Code:
    .sectiontableentry1 {
            color: #000;
            background-color : #BFE4FF;
    }
    
    .sectiontableentry1 a, .sectiontableentry2 a:visited {
    color: #000;
    text-decoration: none;
    }
    
    .sectiontableentry1 a:hover {
    color: #000;
    text-decoration: underline;
    }
    
    .sectiontableentry2 {
            color: #000;
            background-color : #80C9FF;       
    }
    
    .sectiontableentry2 a, .sectiontableentry2 a:visited {
    color: #000;
    text-decoration: none;
    }
    
    .sectiontableentry2 a:hover {
    color: #000;
    text-decoration: underline;
    }
    Also, in IE6, once they click on a link, when they go back to it, its shows up not in black, but the default link color. Any ideas?

  5. #5
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Yes, you are in some things.
    • 'color' is inherited. If you set it for .sectiontableentry1, anything inside it will have the same color.
    • It's best to give all anchors text-decoration:none; at the top of your CSS file to begin with and then underline only those you need.
    Here is a cleaned-up version:
    Code:
    a {
      text-decoration:none;
    }
    .sectiontableentry1,
    .sectiontableentry2 {
      color: #000; /* all the anchors inside these should be black */
      background: #BFE4FF;
    }
    .sectiontableentry2 {
      background:#80C9FF;
    }
    .sectiontableentry1 a:hover,
    .sectiontableentry2 a:hover {
      text-decoration: underline;
    }
    I don't know about your IE6 problem... doing this sort of thing seems to work for me:
    Code:
    .whatever a,
    .whatever a:visited {
      color:black;
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •