Jump to content

s_ff_da_b_ff

Members
  • Posts

    53
  • Joined

  • Last visited

    Never

Profile Information

  • Gender
    Not Telling

s_ff_da_b_ff's Achievements

Member

Member (2/5)

0

Reputation

  1. That makes sense. However, if you look at my code I thought I was already doing that. for example I have ul.domtabs a:hover { background:#ccc ; } Isnt that telling any URL's within the <ul> tag in the domtabs div to be a certain color when hovered? Even though it is taking my other style and making the hover on my tabber black / listed improperly.
  2. Hi. I am making a WordPress site and I am having trouble with my sidebar.php I have a side bar where 80% of the content is inherited through a stylesheet called Stylesheet.css. The last part of the sidebar I want to be a tabber. This tabber I am trying to get in is inheriting domtab.css. So as you can imagine it looks like this <div sidebar> <div> Stylesheet.css content </div> <div> domtab.css content </div> </div> Now the problem is, the tabber is inheriting attributes from the Stylesheet.css file and I don't want that. Here is the site and some images to help.. http://www.theselectedfew.com/ OK in this first image you see how the tabber is portrayed in the sidebar.php ... this is not how its supposed to look http://img6.imageshack.us/i/tabber.png/ this is the tabber in a isolated .html file on my local computer...this is how its supposed to look... http://img519.imageshack.us/i/tabber2.png/ Basically, I want to know why my tabber looks so much different (and also not working properly) Here is the code to domtab.css: *{ margin:0; padding:0; list-style:none; border:none; } body{ font-family:Verdana,Arial,Sans-Serif; font-size:40%; background:#fff; color:#000; } div.domtab{ padding:0 3em; width:20%; font-size:90%; } ul.domtabs{ float:left; width:100%; margin:2em 0 0 0; } ul.domtabs li.domtabs{ float:left; padding:0 .5em 0 0; } ul.domtabs a:link, ul.domtabs a:visited, ul.domtabs a:active, ul.domtabs a:hover{ width:8em; padding:.2em 1em; display:block; background:#fff; color:#000; height:3em; font-weight:bold; text-decoration:none; border-top: 1px solid #000; } html>body ul.domtabs a:link, html>body ul.domtabs a:visited, html>body ul.domtabs a:active, html>body ul.domtabs a:hover{ height:auto; min-height:3em; } ul.domtabs a:hover{ background:#ccc ; } div.domtab div{ clear:both; width:auto; background:#fff; color:#000; padding:1em 3em; border: 1px solid #000; } ul.domtabs li.active a:link, ul.domtabs li.active a:visited, ul.domtabs li.active a:active, ul.domtabs li.active a:hover{ background:#ccc; color:#000; border-top: 1px solid #000; } #domtabprintview{ float:right; padding-right:1em; text-align:right; } #domtabprintview a:link, #domtabprintview a:visited, #domtabprintview a:active, #domtabprintview a:hover{ color:#fff; } p.domtabs{ margin:0 0 .5em 0; line-height:1.3em; } h2.domtabs{ font-size:1.3em; color:#cfc; text-transform:uppercase; font-family:"Trebuchet MS",Arial,Sans-Serif; padding:0 0 .7em .2em; } h1.domtabs{ font-size:2em; text-align:center; font-weight:normal; text-transform:uppercase; font-family:"Trebuchet MS",Arial,Sans-Serif; padding:.5em 0; background:#000; border-bottom:1px solid #000; } pre.domtabs{ font-size:1.2em; padding:1em; } div.domtab div a:link, div.domtab div a:visited, div.domtab div a:active { color:#fff; display:block; padding:1em .5em; font-weight:bold; font-size:1.3em; } div.domtab div h2.domtabs a, div.domtab div h2.domtabs a:hover, div.domtab div h2.domtabs a:active { color:#000; display:inline; padding:0; font-weight:normal; font-size:1em; } /* other scheme! */ #other{ font-size:.8em; margin-left:.3em; width:60em; margin-bottom:3em; float:left; } div#other.domtab div{ clear:both; width:54em; background:#669; color:#fff; padding:1em 3em; } #other ul.domtabs a:hover{ background:#669; } div#other ul.domtabs li.active a:link, div#other ul.domtabs li.active a:visited, div#other ul.domtabs li.active a:active, div#other ul.domtabs li.active a:hover{ background:#669; color:#fff; } #other div{ float:left; } ul.prevnext{ float:left; width:100%; } ul.prevnext li{ float:left; width:49%; } ul.prevnext li.next{ float:right; text-align:right; } Here is the code to sidebar.php: <script type="text/javascript" src="http://www.theselectedfew.com/wp-content/uploads/2009/12/domtab.js"></script> <script type="text/javascript"> document.write('<style type="text/css">'); document.write('div.domtab div{display:none;}<'); document.write('/s'+'tyle>'); </script> </head> <div id="sidebar"> <ul> <?php /* Widgetized sidebar, if you have the plugin installed. */ if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?> <li><h2>Search</h2> <?php include (TEMPLATEPATH . '/searchform.php'); ?></div><div class="clear"></li> <?php wp_list_categories('show_count=&title_li=<h2>Categories</h2>'); ?> <li><h2>Latest Posts</h2> <ul> <?php query_posts('showposts=4'); ?> <?php while (have_posts()) : the_post(); ?> <li><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a> </li> <?php endwhile; ?> </ul> </li> <li><h2>Recent Comments</h2> <ul id="recent_comments"> <?php global $wpdb; $sql = "SELECT DISTINCT ID, post_title, post_password, comment_ID, comment_post_ID, SUBSTRING(comment_content,1,80) AS com_excerpt FROM $wpdb->comments LEFT OUTER JOIN $wpdb->posts ON ($wpdb->comments.comment_post_ID = $wpdb->posts.ID) WHERE comment_approved = '1' AND comment_type = '' AND post_password = '' ORDER BY comment_date DESC LIMIT 4"; $comments = $wpdb->get_results($sql); $output = $pre_HTML; foreach ($comments as $comment) { $output .= "\n<li><a href=\"" . get_permalink($comment->ID) . "#comment-" . $comment->comment_ID . "\" title=\"on " . $comment->post_title . "\">" .strip_tags($comment->com_excerpt). "...</a>"; } $output .= $post_HTML; echo $output;?> </ul> <!-- END --> </li> <?php endif; ?> <div style="padding-top: 20px;"><a href="http://thesidetracked.com/" target="_blank"><img src="http://www.thesidetracked.com/beta/wp-content/uploads/2009/12/tsttsfad.png" border="0" alt="TST"></a> </div> </ul> <div class="domtab"> <ul class="domtabs"> <li class="domtabs"><a href="#what">LATEST</a></li> <li class="domtabs"><a href="#how">CATEGORIES</a></li> <li class="domtabs"><a href="#pr">COMMENTS</a></li> <li class="domtabs"><a href="#style">ARCHIVES</a></li> </ul> <div> <h2 class="domtabs"><a name="what" id="what">LATEST</a></h2> <p></p> </div> <div> <h2 class="domtabs"><a name="how" id="how">CATEGORIES</a></h2> </div> <div> <h2 class="domtabs"><a name="pr" id="pr">COMMENTS</a></h2> <p></p> </div> <div> <h2 class="domtabs"><a name="style" id="style">ARCHIVES</a></h2> <p></p> </div> </div> </div> and lastly, here is the code to Stylesheet.css: /* ------------------------------------------------------------------------ Theme Name:Equilibrium Theme URI:http://madebyon.com Description:Magazine style WordPress theme. Visit <a href="http://equilibrium.madebyon.com"title="Equilibrium">http://equilibrium.madebyon.com</a> for more infomation. Version:1.4 Author:Tudinh Duong Author URI:http://madebyon.com ------------------------------------------------------------------------ */ /* ----------------------------------------- RESET ----------------------------------------- */ *, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td{margin:0; padding:0} table{border-collapse:collapse; border-spacing:0} fieldset, img{border:0} address, caption, cite, code, dfn, em, strong, th, var{font-style:normal; font-weight:normal} ol, ul, li{list-style:none} caption, th{text-align:left} h1, h2, h3, h4, h5, h6{font-size:100%; font-weight:normal} q:before, q:after{content:''} strong{font-weight:bold} em{font-style:italic} a img{border:none} h1, h2, h3, h5, h5, h6{font-weight:bold} /* ----------------------------------------- LAYOUT ----------------------------------------- */ .aligncenter{display:block; margin:0 auto} .alignleft{float:left} .alignright{float:right} .floatLeft{float:left} .floatRight{float:right} .clear{clear:both} /* ----------------------------------------- STRUCTURE ----------------------------------------- */ html, body{height:100%} body{font-size:62.5%; font-family:Arial,Helvetica,sans-serif; color:#222; margin:0 auto -80px; text-align:center} #page-wrap{width:960px; min-height:100%; height:auto !important; height:100%; margin:0 auto -80px; padding-left:10px; padding-right:10px; text-align:left; border: 5px solid #212121; padding-bottom: 10px;} .content{width:680px; float:left} /* ----------------------------------------- TYPOGRAPHY ----------------------------------------- */ p{color:#222; font-size:1.2em; line-height:1.5; margin-top:1.5em; margin-bottom:1.5em; text-align:justify} p a, p a:visited{border-bottom:1px solid #c9c9c9; color:#0B96D0; text-decoration:none} p a:hover{border-bottom:1px solid #c9c9c9; color:#000; text-decoration:none} h1, strong{font-size:1.4em; font-weight:bold} .post h2{text-transform:none; padding-bottom:0; border-bottom:0; margin-top:0; margin-bottom:0} h4, h2{font-size:1.8em; color:#222; text-transform:uppercase; padding-bottom:4px; border-bottom:4px solid #c9c9c9; margin-top:28px; margin-bottom:28px; font-weight:bold} h3{border-bottom:4px solid #C9C9C9; color:#222; font-size:2.2em; font-weight:bold; margin-top:23.3px; padding-bottom:4px} h3 a{text-decoration:none; color:#222} .post ul li, .post ol li{font-size:1.2em; list-style-type:square; margin:5px 0 5px 15px} #reply{border-bottom:4px solid #C9C9C9; color:#222; font-size:1.8em; margin-top:28px; margin-bottom:16px; padding-bottom:4px} /* ----------------------------------------- TOP ----------------------------------------- */ #top{margin-top: 10px; padding-bottom:50px} h1.logo a{float:left; font-size:2.6em; font-weight:bold; color:#000; text-transform:uppercase; text-decoration:none; margin-top: 5px} #nav{float:right; margin-top:1.2em} #nav ul{list-style-type:none; width:100%} #nav li{display:block; display:inline} #nav a:link, #nav a:visited{padding:5px; display:block; color:#353434; margin-right:10px; float:left; text-decoration:none; font-size:1.2em; font-weight:bold; text-transform:uppercase} #nav a:hover{color:#ccc; background:#fff} ul#nav li.current_page_item a:link, ul#nav li.current_page_item a:visited, ul#nav li.current_page_item a:hover, ul#nav li.current_page_item a:active{color:#333; text-decoration:none; background:#ccc} /* ----------------------------------------- FEATURED ----------------------------------------- */ .front-post{width:303px; margin-right:25px; float:left} .front-post-last{width:303px; float:left} .featured-content{position:relative; width:303px} .featured-content p{margin-top:1em} .featured-post{position:relative; width:303px; height:231px; margin-bottom:1.2em} .featured-title h2{margin:8px 10px 7px; line-height:1.4em; font-size:1.1em; text-transform:none; padding-bottom:0; border-bottom:0} .featured-title h2 a{font-size:1.2em; display:block; color:#0B96D0; text-decoration:none; border-bottom:0} .featured-title h2 a:hover{color:#fff} .featured-title{background:#000; display:block; z-index:101; width:100%; bottom:0; filter:alpha(opacity=80); -moz-opacity:.80; opacity:.80; position:absolute; z-index:2} .featured-image{position:absolute; z-index:1} .featured-content h2{margin-top:15px} .featured-content h2 a{color:#0b96d0; text-decoration:none} .featured-content h2 a:hover{color:#000} /* ----------------------------------------- SIDEBAR ----------------------------------------- */ #sidebar{float:right; width:260px; padding-left:20px; overflow:hidden} #sidebar li a{display:block; width:260px; margin:0; padding:4px 2px; list-style:none; border-bottom:1px solid #c9c9c9; font-size:1.2em; list-style-type:none; text-decoration:none; color:#222; text-transform: uppercase; font-weight: bold} #sidebar a{color:#e6e6e6; text-decoration:none} #sidebar a:hover{color:#fff; background-color:#282828} #sidebar h2{font-size:1.8em; color:#222; text-align:right; text-transform:uppercase; border-bottom:4px solid #c9c9c9; margin-top:28px; margin-bottom:0} /* ----------------------------------------- LATEST ----------------------------------------- */ #front-bottom{margin-top:36px} #latest-wrap{float:left; width:680px} .latest-post-wrap{float:left; width:162px; margin-right:8px} .latest-post{position:relative; width:162px; height:118px} .latest-image{position:absolute; z-index:1} .latest-title h2{margin:8px 10px 7px; line-height:1.4em; font-size:1em; text-transform:none; padding-bottom:0; border-bottom:0} .latest-title h2 a{display:block; color:#0B96D0; text-decoration:none} .latest-title h2 a:hover{color:#fff} .latest-title{background:#000; display:block; z-index:101; width:100%; bottom:0; filter:alpha(opacity=80); -moz-opacity:.80; opacity:.80; position:absolute; z-index:2} .latest-content{position:relative; width:162px; height:200px; margin-bottom:20px} .latest-content h2{margin-top:15px} .latest-content h2 a{color:#0b96d0; text-decoration:none} .latest-content h2 a:hover{color:#000} .latest-content p{color:#222; font-size:1.2em; line-height:1.5; margin-top:8px; margin-bottom:1.5em; text-align:left} /* ----------------------------------------- FOOTER ----------------------------------------- */ #push{height:80px} #footer{padding-top:10px; border-top:1px solid #ccc; width:960px; margin:150px auto 0; height:80px; color:#333} #footer p{font-size:1.2em; color:#4d4d4d; line-height:1.5em; margin-bottom:0; margin-top:0.6em} #footer p a{border-bottom:1px solid #c9c9c9; color:#4d4d4d; text-decoration:none} #footer p a:hover{border-bottom:1px solid #c9c9c9; color:#0b96d0; text-decoration:none} /* ----------------------------------------- POSTMETA ----------------------------------------- */ .postMeta{font-size:1.2em; margin-bottom:18px; margin-top:8px; padding-bottom:24px; border-bottom:1px solid #c9c9c9} .postMeta-featured{margin-top:8px; font-size:1.2em; width:303px} .postMeta-front{margin-top:8px; font-size:1.2em} .postMeta-post{font-size:1.2em; margin-bottom:18px; margin-top:8px; border-bottom:1px solid #c9c9c9; padding-bottom:10px} .postMeta span.date, .postMeta-post span.date, .postMeta-featured span.date, .postMeta-front span.date{color:#8a8a8a; float:left} .postMeta span.comments a, .postMeta span.date a, .postMeta-post span.comments a, .postMeta-post span.date a, .postMeta-featured span.comments a, .postMeta-featured span.date a, .postMeta-front span.comments a, .postMeta-front span.date a{float:left; color:#8a8a8a; text-decoration:none} .postMeta span.comments, .postMeta-featured span.comments, .postMeta-post span.comments, .postMeta-front span.comments{float:right; background:#FFF url(images/comment.gif) no-repeat left center; padding-left:15px; margin-left:2px} /* ----------------------------------------- POSTS ----------------------------------------- */ .post-category{color:#8a8a8a; float:left; margin-bottom:8px} .post-tags{color:#8a8a8a; float:right} .post-category p, .post-tags p{color:#8A8A8A; font-size:1em; line-height:1.5em; margin-bottom:0em; margin-top:0em; text-align:none} .post img{margin:0.5em 1em;} .post blockquote p{margin:0 2.6em; font-style:italic} /* ----------------------------------------- COMMENTS ----------------------------------------- */ .comment-heading{margin-bottom:26px; text-transform:none; border:none} .commentwrap{border-top:3px solid #C9C9C9; padding-bottom:15px; padding-top:15px} .commentpost{float:right; width:510px} .commentpost p{margin-top:0} .commentmetadata{float:left; width:20%; color:#2F2B23; line-height:1.5em; padding-right:20px; color:#999; font-size:1.1em} .commentmetadata li{list-style-type:none; padding:.3em; margin:0 .5em 0 0} .commentmetadata li a{border-bottom:1px solid #c9c9c9; color:#0B96D0; text-decoration:none} .warning{padding:10px; background:#282828; border:1px solid #323232; ; margin-bottom:10px} #comments label input{border:1px solid #E5E5E5; padding:5px 4px; margin-bottom:10px; width:160px} #comments label span{line-height:27px} #comments label{font-family:"Lucida Sans Unicode"; font-size:1.1em} #comment_author{margin:20px 20px 20px 0px; padding:0px; width:150px; float:left} #comments-content{display:block; border-bottom:1px solid #C9C9C9; margin:10px 0px 10px 0px; padding:0px} #comments textarea{margin-top:10px; padding:4px 0px; width:100%; border:1px solid #E5E5E5} /* other scheme! */ #other{ font-size:.8em; margin-left:.3em; width:60em; margin-bottom:3em; float:left; } div#other.domtab div{ clear:both; width:54em; background:#669; color:#fff; padding:1em 3em; } #other ul.domtabs a:hover{ background:#669; } div#other ul.domtabs li.active a:link, div#other ul.domtabs li.active a:visited, div#other ul.domtabs li.active a:active, div#other ul.domtabs li.active a:hover{ background:#669; color:#fff; } #other div{ float:left; } ul.prevnext{ float:left; width:100%; } ul.prevnext li{ float:left; width:49%; } ul.prevnext li.next{ float:right; text-align:right; } .button{border:1px solid #E5E5E5; font-size:1.1em; font-weight:bold; height:25px; margin-top:10px; margin-bottom:10px; padding:0 8px; text-transform:uppercase} .children {margin-left: 50px} .children div {border:none} .children .commentwrap {border-top: 1px solid #C9C9C9;} .children .commentmetadata {padding-right:0px} .children .commentpost {text-align:left; float:right; width:78%} /* ----------------------------------------- SEARCH ----------------------------------------- */ #searchform{float:left; margin-top:1em; height:2.3em} #searchsubmit{border:1px solid #E5E5E5; font-size:1.1em; font-weight:bold; height:2.1em; padding:2px 8px; text-transform:uppercase; float:right; background-color:#F0F0F0} #s{float:left; width:204px; margin-right:6px; padding-top:4px; padding-bottom:4px; padding-left:2px; padding-right:2px; border:1px solid #E5E5E5; font-size:1.1em} /* ---------------------------------------- Other ---------------------------------------- */ ::selection { background:#ccc; color:#000; /* Safari and Opera */ } ::-moz-selection { background:#ccc; color:#000; /* Firefox */ } If you have read this far please help, Have tried alot of things and nothing seems to work. Please let me know if I did not explain clear or if you need any other information. Thanks
  3. Ok so I need help with my form validation. There is a drop down menu with these options: First Name Last Name Email Next to the Drop down menu is an input box where the user types in either there first name, last name, email or a combination of both first and last name. Then the query is submited and is sent off to the DB where all the users with related names appear. Example: 1. *base case* user doesnt type in anything to the input box : error message appears 2. User does not select anything in the drop down but types in name: All people with same name should appear 3. I select first name in drop down menu I type in : 'Steve' into the input box and hit submit all people with first name Steve appear you get the picture heres what I have so far (no much) function searchValidation(){ valid = true; if (document.search_form.input.value == "") { alert ( "Please fill in search criteria" ); valid = false; } else { (document.search_form.input.value != "") ..... } }
  4. well I was going to help you until I saw it was a sailor moon rpg...lmao
  5. my website is www.thesidetracked.com when you go to the site you will see that we have a Featured Gallery banner right below our header that has multiple images transitioning in and out. well..i dont understand as to why it is also pushing my sidebar down (the side bar has the search engine up top). The side bar should be level with the Featured Gallery image. I am assuming that it is because i am using a wrapper but im hoping some one could give me some pointers
  6. ok this is my site: www.thesidetracked.com on the right you can see the our 'tabber' with The Side, Catergories, and Archives. now if you hover over the options in there you can see that the font color changes from black to grey and the background of the div does not change like the rest of the dives below on the side bar (scroll down and hover over the links under THE WARD) here is my code for the tabber i dont understand why its not working: /*-------------------------------------------------- .tabbertab = the tab content Add style only after the tabber interface is set up (.tabberlive) --------------------------------------------------*/ .tabberlive .tabbertab { padding:3px; border:1px solid #000; border-top: 1px; background: #ececec; /* If you don't want the tab size changing whenever a tab is changed you can set a fixed height */ /* height:200px; */ /* If you set a fix height set overflow to auto and you will get a scrollbar when necessary */ /* overflow:auto; */ } .tabberlive .tabbertab ul li ul:hover{ color:black; background:#fff; text-decoration:none; } .tabberlive .tabbertab ul li ul a:hover{ color:black; background:#fff; text-decoration:none; } as you can see i want the original bg color to be #ececec then when you hover it goes to white...and also idk why the font is changing to grey? I have it set to black on both accounts...
  7. thx haku appreciate it
  8. OK I have never done that before. Can you give me an example of what you mean using CSS code.
  9. Ok so I have a side bar with a bunch of divs that are links. When the mouse hovers over it I want the entire div box to change color but for some reason on the letters are being affected by the hover call. check www.thesidetracked.com -- look at the side bar to the right and the list of links under Categories, Recent Comments, Archives, ect. When you hover over it only the text is being effected but i want the entire div box effected. Code: #sidebar { color:#999999; float:right; font-size:11px; margin-top:10px; padding-bottom:25px; text-align:left; width:300px; } a:hover { color:#ccc; } #sidebar a:hover{ color:#FFF; background:#ececec; } #sidebar ul li a:hover{ color:#FFF; background:#ececec; } #sidebar a { border:medium none; font-weight:bold; } #sidebar ul { list-style-image:none; list-style-type:none; margin:0px; } #sidebar ul li { list-style-type:none; padding:5px 0px; list-style-image:none; } #sidebar ul li ul { list-style:none; margin:0px; } #sidebar ul li ul li { background:#ececec; color: #000; margin:0px; border-bottom:1px solid white; padding:2px 0px 2px 14px; } any ideas?
  10. s_ff_da_b_ff

    IE Hacks

    ok so I know you have to do that <--[if IE ]--> blah blah blah crap. Then I have to create a new style sheet specific to the one I put in between those <--[ ]--> tags or w/e. So where do I go from there? Do I have to code the entire website from scratch again? How do I know what I need to code differently between an IE browser and all the other browers I HATE IE.
  11. Film God your the one whos supposed to be answering the questions on asking!
  12. not bad. definitely think you need a form rather than a contact information -- I think the main page looks good the other pages are rather bland though. good start!
  13. I like the layout alot. Did you make it?
  14. Hmm so you think its not even worth editing my site for IE? Everything is perfect in FF and Opera.
×
×
  • 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.