Jump to content
Killersites Community

Search the Community

Showing results for tags 'CSS'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Entrepreneurship, Business and Marketing
    • Course: Business Battle Plan
    • Social Media Marketing & Web Marketing
    • Entrepreneurship
  • Community Lounge and FAQ
    • Open Forum
    • New Members Forum - Start Here!
    • Forum Rules and Etiquette
    • Killersites Announcements
  • Web Design
    • Beginners Web Design
    • HTML/XHTML
    • CSS
    • Advanced Web Design
    • Business of Web Design
    • Web Design News
  • Software
    • StudioWeb
    • Dreamweaver
    • Photoshop
    • Miscellaneous Software
  • Programming
    • Python
    • Javascript
    • PHP
    • General Programming
    • Beginners Ruby
  • Miscellaneous
    • Cybersecurity
    • Blogs and CMS
    • Web Accessibility
    • Peer-to-Peer Reviews
    • Website Templates
    • Web Design Jobs
  • Archives
    • Beginners Web Design
    • Web Accessibility
    • CSS
    • Flash
    • ASP
    • Expression Web
    • Killersites University
    • Actionscript

Calendars

  • Community Calendar

Categories

  • Web Templates
  • PHP Script Bank
  • Javascript Script Bank
  • Web Design Documents and Contracts

Found 8 results

  1. CSS Specificity Wars

    Hi, I am just going through the CSS Specificity on one of Stefan's courses and I remembered an article I read (many years ago) on Andy Clarkes website - www.stuffandnonsense.co.uk where he explains CSS specificity using Star Wars characters. To read the article (unfortunatelly plain HTML without styling due to being an archive from 2005) go here: https://stuffandnonsense.co.uk/archives/css_specificity_wars.html
  2. Rounding Images With Css3

    In the old days, we had to go to Photoshop (or some other image editor) to create rounded PNG or GIF files, to create images that were round. Now you can do this with simple CSS3 applied to your image: style="border-radius: 50%;" So the CSS applied would look something like: <img style="border-radius: 50%" src="stefan_mischook-150x150.png"/> Stef
  3. Dropdown Menu Help Please

    I made a navbar (I guess that's what it's called) for my website. Horizontal. It has the look I want and it works. But I have client-related pages that will fill their respective navbars up fast, making them crowded, probably even falling off the right side of the pages. So I need to make my existing format into a dropdown type. I tried to integrate tutorial code I found online into making this, with bad results. The navbar background color (#000) grew in height when a submenu item dropped down, instead of that menu item alone being #000. Would someone look at my code and get me headed in the right direction with the current style I have? <div id="navigation"> <ul> <li><a href="index.html" class="active"><span>Home</span></a></li> <li><a href="about.html"><span>About Us</span></a></li> <li><a href="services.html"><span>Services</span></a></li> <li><a href="register.php"><span>Register</span></a></li> <li><a href="client.php"><span>Client Area</span></a></li> <li><a href="contact.php"><span>Contact Us</span></a></li> </ul> </div> #navigation { font-family: ambleregular; font-size: 1.1em; float: left; width: 100%; background-color: #000; } #navigation ul { margin: 0; padding-left: 62px; text-transform: uppercase; } #navigation ul li { list-style-type: none; display: inline; } #navigation li a { display: block; float: left; padding: 5px 10px; color: #fff; text-decoration: none; border-right: 1px solid #fff; } #navigation li a.active { display: block; float: left; padding: 5px 10px; color: #fff; background: #696969; text-decoration: none; border-right: 1px solid #fff; } #navigation li a:hover { background: #2F4F4F; } #navigation li a:active { background: #C0C0C0; } That's what I'm using. Thanks for any and all help.
  4. Border Issue

    Hello, Im trying to put a 10px white solid border around an image that i inserted into my home page. I'm using relative positioning to get the image where i want it. But the border does not apply around the image on the right and bottom? Is there something else i have to do to set the border correctly?
  5. Nav Bar Floated/positioned Right

    I'm trying to float or position the Nav bar to the right side of the screen, When i add that header image it moves my nav bar either to the left or changes it back to stack it like an generic unordered list. I have been using floats and clears to get it positioned correctly? Is there something else im missing?
  6. Background Image Problem

    What im trying to get is: body { background-image: url("images/witewall.png"); background-repeat: repeat; } I want the background image to show and repeat over the whole page of the body element. I havent been able to get it to show so far? Is there something i'm missing?
  7. I want my tooltip element (the <span>) to appear above everything on the page but still relative to its parent element (the <td>). JS to show/hide the <span>: window.AETid = "AE"; function tooltip(tid) { console.log('run the tooltip...id: '+tid); document.getElementById(tid).style.display="block"; } function hideTooltip(tid) { document.getElementById(tid).style.display="none"; } HTML: <td onmouseover="tooltip(window.AETid);" onmouseout="hideTooltip(window.AETid);"> Send reminders? <span class="tooltip" id="AE">this is the tooltip</span> </td> CSS for .tooltip: .tooltip { color: #ff0000; display: none; z-index: 100; position: relative; right:0px; bottom: 0px; } Currently, the tooltip appears as expected when I hover over the <td>, but it appears within the <td> element, thus changing the size of the <td> and thus the <tr> and thus the <table>. I want the tooltip to appear, well, like tooltips to: above and not effecting the rest of the page. z-index doesn't seem to do it alone in my case... All help is greatly appreciated
  8. Hi, I'm a total newbie at CSS, and I can't figure out why things aren't working, or what to do to fix them. Right now I'm having trouble with a background image: I've specified a height and width, but the full height of the image isn't appearing. #navigation { width= 960px; height= 388px; padding: 20px 0 0 0; /*top right bottom left*/ margin: 0 0 0 0; /*top right bottom left*/ background-image: url(zeitgeist_images/buts/header.png); background-repeat: no-repeat; background-position: center top; } Can someone tell me what I'm doing wrong? Should I just increase the padding until the image is visible? I also want to place some png buttons on top of the background. How can I do that? Thanks!
×