Jump to content

Search the Community

Showing results for tags 'Underline'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 4 results

  1. Hello, I've been trying to code my site so that when you hover over a button (i.e. "Photo Gallery") it will underline from left to right as a transition/animation. Here is a link that shows almost exactly what I want to do ( the underline part) http://radiatingstar.com/unorthodox-ideas-for-ahover-effects As I said, I've been trying to make this work but haven't had any luck. I noticed the content: " "; is empty, so I'm not sure if that's what I'm missing, but I don't know what to put there. Thanks in advance for your help!
  2. I'm having issues with a list displaying properly, or at least how I'd like it to, in IE. It shows up like so in Firefox and Safari: With IE, the circles around the list items are squares. Does anyone have a fix for this? Here is the CSS for the list: .circlemenu{width: 100%;overflow:hidden;margin: 1.2em 0em} .circlemenu ul{margin: 0;padding: 0;font: bold 14px Geneva, Arial, Helvetica, sans-serif;list-style-type: none;text-align: left; /* "left", "center", or "right" align menu */margin: 0em 0em 0em 10em} .circlemenu li{display: inline;} .circlemenu li a{display:inline-block;text-align:center;text-decoration: none;border: solid 1pt #555555;color: #555555 ;margin: 0;margin-right:6em; /*right spacing between each link */width: 6em;height: 6em;border-radius: 4em; /*really large border radius to create round borders*/-moz-border-radius: 4em;-webkit-border-radius: 4em;} .circlemenu a span{position:relative;top:40%;} .circlemenu li a:visited{color: white;} .circlemenu a:hover{border: solid 1pt #CC0000;color: #CC0000;}
  3. Hi there, I would like to know if there is a nicer CSS approach for the following effect: <style type="text/css"> a { color: #000000; text-decoration: none; } a:hover, a:active { text-decoration: underline; }</style><a href="#"> w3schools </a> Using & nbsp; in both sides is a way. But can I use padding, and include a "box" inside the <a> and let the <a> underline the whole "box" with padding? (i tried but this does not work.) The concept is: <style type="text/css"> a { color: #000000; text-decoration: none; } a:hover, a:active { text-decoration: underline; } div { padding: 0px 2px; }</style><a href="#"><div>w3schools</div></a> It underlines only the words, but skipping the paddings THANKS very much for any helps or input!midnite
  4. Hi I'm trying to build a Link Generator (just for practice) and am trying to add the option to specify whether it is underlined (using style attribute). However, it no longer works at all. Can someone help? Link: http://dl.dropbox.co...Untitled-3.html Relevant Code: <head><script>/*Functions*/function editLink(){var lText= document.getElementById('linkText');var lURL= document.getElementById('linkURL');var lUL= lUL_value();var taValue= document.getElementById('taHTMLoutput');function lUL_value(){var a=document.form1.uLine;if ('a==yes'){return "style=\"text-decoration:underline;\"";}else{return "style=\"text-decoration:none;\"";};}function changeHTML(){return "<a href=\"" + lURL.value + "\" " + lUL.value + ">" + lText.value + "</a>";};taValue.value= changeHTML();document.getElementById('outputP').innerHTML = "<a href=\"" + lURL.value + "\" " + lUL + ">" + lText.value + "</a>";}function select_content(elementID) { // first set focus document.getElementById([elementID]).focus(); // select all contents document.getElementById([elementID]).select(); }function writepageTitle(){// not workingvar pgTitle= document.getElementById('title');document.getElementById('footerpageTitle').innerHTML = pgTitle.innerHTML;}/*Other*/window.onload = 'writepageTitle';// ^^ not working ^^ //</script></head> <body><div id="uberContainer"><header>...</header><div id="mainContainer"><table align="center"><tr><td><form id="form1" onsubmit="return false;" style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td><label for="uLine">Underline</label></td><td><input id="uLine_yes" type="radio" name="uLine" value="yes" /> Yes <input id="uLine_no" type="radio" name="uLine" value="no" /> No<br /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><form id="formHTMLoutput"><textarea onClick="select_content('taHTMLoutput');" value="" id="taHTMLoutput"readonly placeholder="The HTML code for the Link will appear here!"></textarea></form></td></tr></table></td></tr></table></div><footer>...</footer></div></body></html> Full Code: <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title id="title">Element Express.: Link Maker!</title><style>/* element styling *//* */a{color:#F28705;text-decoration:none;}a:visited{color:#BF3604;}body{font:Tahoma, Geneva, sans-serif;font-family:Tahoma, Geneva, sans-serif;background-color:#324452;color:#cccccc;}textarea{max-width:600px;min-width:350px;min-height:100px;}table{vertical-align:text-top;}hr{ }input{vertical-align:text-top;}/* element id styling *//* */div#uberContainer{max-width:75%;margin-left:auto;margin-right:auto;left:50%;outline:solid;outline-color:#97BDBF;min-height:100%;}nav#mainNav{vertical-align:top;right: 10%;}/* classes *//* */.inputRight{margin-left:auto;left:100%;}.class1{color:#97BDBF;}</style><script>/*Functions*/function editLink(){var lText= document.getElementById('linkText');var lURL= document.getElementById('linkURL');var lUL= lUL_value();var taValue= document.getElementById('taHTMLoutput');function lUL_value(){var a=document.form1.uLine;if ('a==yes'){return "style=\"text-decoration:underline;\"";}else{return "style=\"text-decoration:none;\"";};}function changeHTML(){return "<a href=\"" + lURL.value + "\" " + lUL.value + ">" + lText.value + "</a>";};taValue.value= changeHTML();document.getElementById('outputP').innerHTML = "<a href=\"" + lURL.value + "\" " + lUL + ">" + lText.value + "</a>";}function select_content(elementID) { // first set focus document.getElementById([elementID]).focus(); // select all contents document.getElementById([elementID]).select(); }function writepageTitle(){// not workingvar pgTitle= document.getElementById('title');document.getElementById('footerpageTitle').innerHTML = pgTitle.innerHTML;}/*Other*/window.onload = 'writepageTitle';// ^^ not working ^^ //</script></head> <body><div id="uberContainer"><header><table id="table_deleteID" width="100%"><tbody><tr><td><h1>Welcome!</h1></td><td width="50%" align="right"><nav id="mainNav"><a href="">Home</a> | <div id="elementsnavContainer"><a onmouseover="">Show stuff on mouse over!</a><br><div id="elementsnavDropdown">Hey</div></div></nav></td></tr></tbody></table><div id="mydiv2" style="cursor:crosshair"></div><hr class="class1" /></header><div id="mainContainer"><table align="center"><tr><td><form id="form1" onsubmit="return false;" style="border:1; border:#666"><legend><h3>Link Details</h3></legend><div id="formContainer"><table><tr><td><label for="linkText">Link Text</label></td><td><input class="inputRight" id="linkText" autofocus="autofocus" placeholder="Mel Jones Photography Ltd." required size="40" type="text" autocomplete="on" /></td></tr><br /><tr><td><label for="linkURL">Link URL</label></td><td><input type="url" required class="inputRight" id="linkURL" placeholder="http://meljones.info/" autocomplete="on" size="40" /></td></tr><tr><td><label for="uLine">Underline</label></td><td><input id="uLine_yes" type="radio" name="uLine" value="yes" /> Yes <input id="uLine_no" type="radio" name="uLine" value="no" /> No<br /></td></tr><tr><td></td><td><button onclick="editLink();">Amend Link!</button></tr></table></div></form></td><td><table><tr><td><h3>Output: </h3></td><td><p id="outputP"></p></td></tr><tr><td>HTML:</td><td><form id="formHTMLoutput"><textarea onClick="select_content('taHTMLoutput');" value="" id="taHTMLoutput"readonly placeholder="The HTML code for the Link will appear here!"></textarea></form></td></tr></table></td></tr></table></div><footer><hr><table width="100%"><tbody><tr><td align="center" width="33%"><a href="http://www.meljones.info/">Mel Jones Photography Ltd.</a></td><td align="center" width="34%">© Daniel Carl 2011</td><td align="center" width="33%"><p id="footerpageTitle"></p></td></tr></tbody></table></footer></div></body></html>
×
×
  • Create New...