|
HTML - Toc Style Dotted Line (tab Fill) In Html?
I'm trying to come up with a way to mimic a "tab fill" in html:
Like this only the page numbers would be justified to the same line, and the . .. is "auto generated" to fill the empty space: 1. The First Line ................................... 25 2. Below The First ................................. 32 3. After That .......................................... 47 The "titles" would be in column 'a', and the numbers would be in column 'b' The space after the "titles" would be filled with ... I have come close using 'bottom border' but that puts the ... under the text as well. I tried using span and div, but that will either putt the ... on a new line below the text, or if i use 'display:inline;' it puts it on the same, but it no longer fills the empty space to the edge, and only displays the ... when there is text inside. I tried stretching it out with a clear image but it didn't work either. Also tried using a 'highlight' (background color) on the text to cover the bottom border but that didn't really work. (the closest i got was using this method with a background image of a dot. but that wasn't much better...) Any thoughts? Thanks. Similar TutorialsHey. Does anyone know why sometimes, after clicking on a link on my site, a dotted line appears around the link??? It doesnt matter if its a jpg, text or image map link. It doesnt always do it, but sometimes it does and looks ****ty.... thx Hi, I'm trying to find a way to fill the empty space between a description and its relative letter for example: blablablalbalbalblablabla (***carry over to the second line because out of space) blabla----(white space)----a. (** the letter) the description is done by cold fusion query and the structure is in a table with the vertical align = bottom to ensure the letter match the last line of the description. now I need to make change to this so that the whitespace between the last line do the description and the letter is filled with dots like this: blablablalbalbalblablabla (***No dots on the line above the last line) blabla ............................ a. I've tried number of methos but none of them sync well with my situation, Any suggestion on how to do this will be greatly appreciated, Thanks in Advance!! Hi Guys, If you use this page in firefox you get an active link, dotted border on the up/down arrows. Anyone know of a way to stop this happening with styles? Code: http://www.stompfrog.co.uk/rp/ I guess you could use a js function to take the focus off the link but would prefer a css solution if possible. Stomp I have had this problem on almost all the websites I've made and I'm too picky to let it go... When I make the navigation images/buttons for a website, I set the border to zero as usual and link each image to its respective page. But, when I click on the image to take me where it's supposed to, this pesky dotted border appears around the edge of the image after it has been clicked and it remains there until I click on something else on that page. (This also happens to text links when clicked, but I'm not too worried about the text links.) For the websites I've made that go to an entirely new page after an image link is clicked, the dotted line appears around the linked image after it's clicked and before the next page has loaded, but then after the new page loads the dotted line is gone. But, for websites I have built that utilize frames, because the new page that loads is in an iframe, and because the page the navigation buttons are located on never changes, the dotted border stays around the image after its been clicked and, like I mentioned earlier, doesn't go away until I click on something else on that same page. An example of this can be seen when you click the images in the navigation column along the left side of a website I built located at the following URL: http://www.djprogress1.com/ This border problem could be specific to my website browser (I use Firefox), but I am not sure. And the border could be added entirely by the browser and there may be no way to get rid of it through coding, but again, I am not sure of this. So, does anyone know if anything can be done to fix this or am I stuck with these dotted borders? Thanks, Jase Perhaps it's just me, but I recently noticed this and I'm curious as to how it works. I don't even know if this is the right forum for this though. Take a look at these two pictures and websites. http://www.slidedeck.com/examples/reddal http://www.friendgiftr.com/ If you notice in the picture and the actual website, the first example does not show a tiny dotted border around the link that you click. But on the second site, clicking on a link will have that link surrounded by the thin dotted border. At least that's how it is for me on the latest version of Firefox and Internet Explorer. Is this something browser based? Or what? Why the inconsistency? hey just wondering if there was a html style switcher, not a php one! if thgere was plz help me and tell me it! Hey all, I'm having a bit of trouble applying the style keyword to get it to work in firefox. It works fine in internet explorer. my code is: <table style="position:absolute;left:220;top:155" > as in it doesnt position the table in absolute, it still puts it UNDER any text rather than applying the position any ideas as to why this isnt working in firefox? is there an equivelent I can use to position a table on the screen? hello, Im a noob at HTML and was wondeirng if you guys/gals could help me. Im trying to make a bracket and I am not sure how to make the line centered with the other lines. here is the code Code: td {
vertical-align: middle;
width: 10em;
margin: 0;
padding: 0;
}
See how each horizontal lines are centered with the 2 horizontal lines that come before it in this example? http://sharkspage.com/jpgs3/2007bracket2.gif my problem is the code i'm using centers the horizontal line with the words on the lines, not the actual 2 horizontal lines. So if the word on the top line is 50 characters taking up 3 rows, and the word on the bottom line it 5 characters using 1 row, the line is way off-centered. Here is my messed up Bracket http://warchant.0catch.com/WarchantBracket.html here is the HTML, couldn't fit the whole thing here so I only went as far as Region 1 HTML Code: Warchant Movies
<html lang='en'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=ISO-8859-1'>
<title>Page Title</title>
<!-- link rel='stylesheet' href='style.css' type='text/css' -->
<style type="text/css">
<!--
table {
border-collapse: collapse;
border: none;
font: small arial, helvetica, sans-serif;
}
td {
vertical-align: middle;
width: 10em;
margin: 0;
padding: 0;
}
td p {
border-bottom: solid 1px black;
margin: 0;
padding: 5px 5px 2px 5px;
}
-->
</style>
</head>
<body>
<table summary="Tournament Bracket">
<tr>
<td><b>Region 1</b><p>1. Star Wars: Episode IV - A New Hope</p></td>
<td rowspan="2"><p></p></td>
<td rowspan="4"><p></p></td>
<td rowspan="8"><p></p></td>
<td rowspan="16"><p></p></td>
<td rowspan="32"><p></p></td>
<td rowspan="64"><p></p></td>
<td rowspan="128"><b>Champion</b><p></p></td>
</tr>
<tr>
<td><p>32. Wizard of Oz</p></td>
</tr>
<tr>
<td><p><br>16. Fight Club</br></p></td>
<td rowspan="2"><p></p></td>
</tr>
<tr>
<td><p>17. Old School</p></td>
</tr>
<tr>
<td><p><br>9. Blazing Saddles</br></p></td>
<td rowspan="2"><p></p></td>
<td rowspan="4"><p></p></td>
</tr>
<tr>
<td><p>24. Deer Hunter</p></td>
</tr>
<tr>
<td><p><br>8. Tombstone</br></p></td>
<td rowspan="2"><p></p></td>
</tr>
<tr>
<td><p>25. Clockwork Orange</p></td>
</tr>
<tr>
<td><p><br>4. Saving Private Ryan</br></p></td>
<td rowspan="2"><p></p></td>
<td rowspan="4"><p></p></td>
<td rowspan="8"><p></p></td>
</tr>
<tr>
<td><p>29. Star Trek II: The Wrath of Kahn</p></td>
</tr>
<tr>
<td><p><br>13. The Longest Day</br></p></td>
<td rowspan="2"><p></p></td>
</tr>
<tr>
<td><p>20. The Longest Yard (Original)</p></td>
</tr>
<tr>
<td><p><br>12. Apocalypse Now<br></p></td>
<td rowspan="2"><p></p></td>
<td rowspan="4"><p></p></td>
</tr>
<tr>
<td><p>21. Jaws</p></td>
</tr>
<tr>
<td><p><br>5. Raiders of the Lost Ark</br></p></td>
<td rowspan="2"><p></p></td>
</tr>
<tr>
<td><p>28. Boyz in the Hood</p></td>
</tr>
<tr>
<td><p><br>2. Braveheart</br></p></td>
<td rowspan="2"><p></p></td>
<td rowspan="4"><p></p></td>
<td rowspan="8"><p></p></td>
<td rowspan="16"><p></p></td>
</tr>
<tr>
<td><p><br>31. Say Anything</br></p></td>
</tr>
<tr>
<td><p><br>15. Bridge Over the River Kwai</br></p></td>
<td rowspan="2"><p></p></td>
</tr>
<tr>
<td><p>18. The Magnificent Seven</p></td>
</tr>
<tr>
<td><p><br>10. The Incredibles</br></p></td>
<td rowspan="2"><p></p></td>
<td rowspan="4"><p></p></td>
</tr>
<tr>
<td><p>23. The Quiet Man</p></td>
</tr>
<tr>
<td><p><br>7. The Godfather</br></p></td>
<td rowspan="2"><p></p></td>
</tr>
<tr>
<td><p>26. Tora, Tora, Tora</p></td>
</tr>
<tr>
<td><p><br>3. The Big Labowski</br></p></td>
<td rowspan="2"><p></p></td>
<td rowspan="4"><p></p></td>
<td rowspan="8"><p></p></td>
</tr>
<tr>
<td><p>30. Return to Me</p></td>
</tr>
<tr>
<td><p><br>14. Young Frankenstein</br></p></td>
<td rowspan="2"><p></p></td>
</tr>
<tr>
<td><p>19. Rocky IV</p></td>
</tr>
<tr>
<td><p><br>11. A Bridge Too Far</br></p></td>
<td rowspan="2"><p></p></td>
<td rowspan="4"><p></p></td>
</tr>
<tr>
<td><p>22. A Few Good Men</p></td>
</tr>
<tr>
<td><p><br>6. Full Metal Jacket</br></p></td>
<td rowspan="2"><p></p></td>
</tr>
<tr>
<td><p>27. Goodfellas</p></td>
</tr>
<br>
Appreciate any help Trying to build an HTML email using tables and inline CSS but the text in the HTML cell is not functioning properly. An unwanted "line-break" is appearing at the first line. So the first line of text starts on the second line. I have tried: margin-top: 0px; as well as padding: 0px 0px 0px 0px; My code looks like this: <p style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #FFFFFF; margin-top: 0px; line-height: 13px"> or this <p style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #FFFFFF; margin-top: 0px; line-height: 13px"> Are there any other top margin style controls I can use? p.s. I have only notice the issue in Hotmail. Hello everyone. I'm not sure what type of menu this is called, and I believe it's Javascript, but I'm just not sure. What it is is a menu that just shows the top level, but when you click on it, it drops down to show you a sub-level. Does anyone know what this type of menu is called? Any help is greatly appreciated. Thanks! Hi there, After moving some webpages around with Expression Web, all my HTML is now on one line for each page! Is there a tool, website or some way of changing all the text back to something like: <tag> content </tag> <another tag> something else </you get the idea...> Thanks! I've create the line using html tag <hr> in my php program. I modified the line style as <HR width="100%" COLOR="BLUE" SIZE="4" NOSHADE> but in the browser it doesn't show any color and line size as i modified. It only shows a line with no effect (not blue color and size is normal). When i tested it in the another php file, it works. Is it becuase of my php coding in a file?or what? My coding is HTML Code: <table id="content">
<tr><td id="content" colspan="2"><HR width="100%" COLOR="BLUE" SIZE="4" NOSHADE></td>
</tr>
<tr>
<td align="left"><?php if ($breadcrumb != ""): ?>
<?php print $breadcrumb ?>
<?php endif; ?></td>
<td><div align="right"><font size="1" face="Arial, Helvetica, sans-serif"><a href="http://www.yahoo.com" target="_blank">Yahoo</a> | <a href="http://www.google.com" target="_blank">Google</a></font></div></td>
</tr>
</table>
Any idea or suggestions are welcome. Good day/night ALL. I am new to html, I tried sample webpage but could not figure out how to start paragraph in new line. Please help. This is my sample page: <HTML> <HEAD> <TITLE>my first web page</TITLE> </HEAD> <BODY bgcolor="#0099FF" text="#FFFF00" background="bluetile.jpg"> <H1 align=left>Hello World</H1> <P align=left>Hello World</P> <font face="arial">this is the arial font face</font> <font size=7>size 7</font> <font face="georgia, times new roman, arial">alternative fonts</font> <font face="arial" color="#FF0000">this is the arial font face</font> <TT>teletype text is monospaced which means each letter takes up exactly the same amount of space</TT> <PRE> .--, .-. __,,,__/ | / \-'` `-./_ | | `) \ ` `\ ; / , , | | / : O /_ | O .--;__ '. | ( )`. | \ `-` / | \ ,_ _.-./` / \ \``-.( / | `---' /--. ,--\___..__ _.' /--. jgs \ `-._ _`/ ' '. .-' ` ' . `` ' ; </PRE> <a href="index.html"><img src="home.gif"></a> <CENTER> <BR> <BR> <BR>This is my very first webpage, aint i clever? </CENTER> </body> </HTML> Hi when i click on the echolot link it goes to http://mydomain/modified/Echolot.html but i want it to go to http://www.mydomain/echolot/echolot.html how do I change the line below which is on the index.html page: <TR> <TH COLSPAN=2 BGCOLOR=green;><a href="./Echolot.html" title="Echolot" alt="Echolot">Echolot</a></TH> </TR> xstation I am having no luck changing the line spacing of a single paragraph. I looked online and found something on using it in a div tag: Code: div {line-height: 5px;}
but everything else is with CSS. What would be the simplest way to encode a paragraph with a smaller line space between lines? Anders I've made an incredibly simple html page as an active desktop for a gpo policy, however there's been an uproar about colours so I thought I'd give it a stab to have a drop-down box to select from a range of colours for the body style tag. Any suggestions? <html> <head> <!--808080--> <title>ArchitenBG</title> <STYLE type="text/css"> body { background-color:#3A6EA5; } #div1 { position: absolute; size: 50%; bottom: 0px; right: 0px;} </STYLE> </head> <body> <div id="div1"><img src="Talbg.png" /></div> </body> </html> I have found what seems to be a rather big problem in the HTML canvas When drawing circles, and I presume all shapes, the size of the circle is different based on whether one is filling it, or sketching it. If we have a circle of radius 10 and line width k, and we decide to fill it, that line width will be evenly dispersed about the perimeter of the circle such that half the line width is inside the circle, and half is outside the circle. If, however, the same circle is sketched, the line width will still be the same, but it will now be dispersed entirely on the outside of the circle, thus making it larger. If I am wrong, and this is how figures are supposed to be drawn, or if I am simply not using the right settings, please let me know =) HTML Code: <textarea wrap='soft' name='newsMsg' cols='20' rows='7'
class='newsMsg cleardefault'></textarea>
And that is my textarea code. The problem is that is doesn't wrap the text when typing it in the textarea. Any help would be appreciated. Thanks in advance. Hello, I add a HTML page within wordpress site at http://www.cowism.com/pg_0003-2/ and the entire HTML section of page is shown as a single line of overlapped text. Please help me add HTML perfectly within the wordpress post/page Thanks in advance in the past when ever I have string that is longer than the width specified in the <td>it always automatically line breaked for me. But now I am encountering an issue with the <td> stop auto line breaking, and instead just increase the width of the table to make the string fit in 1 line. if anyone know whats possibly causing this problem please reply, any thing suggestion is greatly appreciated. Thanks |
|||||||