 Trouble With Links On A List, i want to display it inline |
|
|
|
|
  |
 Sep 13 2005, 09:53 PM
Post
#1
|
|
|
Super Member  Group: Members Posts: 282 Joined: 1-September 05 From: Wanatos Member No.: 11,382  |
I have a menu that i want to display inline, in the same row, something like this:
CODE <style type="text/css"> ul{float:left;width:100%;padding:0;margin:0;} a{float:left;text-decoration:none;color:white;background-color:red; padding:5px 10px;} a:hover {background-color:blue} li {display:inline} </style> The only problem is that i want a custom img for showing as CODE list-style: url(img/bullet.gif) But seems that display:inline makes my bullet go away... could some one point me in the right direction? Thanks in advance... |
 |
 
|
|
Sep 13 2005, 10:11 PM
Post
#2
|
|
|
Super Member Group: Members Posts: 210 Joined: 13-September 05 Member No.: 11,799 |
can u explain a little more of wat u want. TY
|
|
|
|
|
Sep 13 2005, 10:14 PM
Post
#3
|
|
|
Super Member Group: Members Posts: 475 Joined: 22-August 04 Member No.: 877 |
i understand that you want to display that menu and everything looks good on that part but you want to use a custom image for what? Did you want some kind of icon or somethng you need to better explain to me the custom picture part it could be a background icon or anything i dont really know for sure whats going on with that part. Also if you want the bullets to stay then your coding is wrong. I dont really know what you want though let me know and then i can help you as much as possible.
|
|
|
|
|
Sep 13 2005, 10:24 PM
Post
#4
|
|
|
Super Member Group: Members Posts: 282 Joined: 1-September 05 From: Wanatos Member No.: 11,382 |
I am sorry for not explaining right.
I want a menu, which is in fact a list with links, to be displayed inline, but i want each list item to keep its bullet, which is a custom image, but as soon as i get it inline, it removes the bullet... So i hope you guys understand me better this time... |
|
|
|
|
Sep 13 2005, 10:26 PM
Post
#5
|
|
|
Super Member Group: Members Posts: 210 Joined: 13-September 05 Member No.: 11,799 |
hmmmm
im not sure maybe your bullitens are to big. Try some sites on the web some make drop down menus for you onb the site and give u the code for it |
|
|
|
|
Sep 13 2005, 10:44 PM
Post
#6
|
|
|
Super Member Group: Members Posts: 282 Joined: 1-September 05 From: Wanatos Member No.: 11,382 |
QUOTE(shadowdemon @ Sep 13 2005, 04:26 PM) hmmmm im not sure maybe your bullitens are to big. Try some sites on the web some make drop down menus for you onb the site and give u the code for it  not too big becouse when i remove the line that declares the "display: inline" they come back to life... and im searching the web for it, it was w three skulls where i got this code anyway on the first place... but im askin if some one knows right now to post it here... thanks anyway  this is the actual code im using, that is working: CODE CSS: #footer ul {list-style: url(img/bullet.gif) inside;width:100%;padding:0;margin:0;} /* #footer ul li {display:inline;} */ #footer a {text-decoration:none;padding: 0 10px 0 0;color:#FFFFFF;} Note that the footer ul li is between comments? When i remove the /* */ my list becomes one line, but the list-style bullet gets removed too... and i *DO* want my bullets there... so im asking if some one knows how to hack that down... thanks |
|
|
|
|
Sep 18 2005, 04:17 AM
Post
#7
|
|
|
A computer once beat me at chess, but it was no match for me at kick boxing.  Group: [MODERATOR] Posts: 4,076 Joined: 24-July 05 From: Linix, DOS and Windows…the good, the bad and the ugly Member No.: 9,787  |
css code here:
CODE #nav { text-align: right; font-family: trebuchet ms, arial, agency; color: #B85C00; font-size: 10pt; padding-right: 16px; } and html code here: CODE <p id="nav"><u> <a href="index.html">Home</a> | <a href="contacts.html">Contact List</a> | <a href="teams.html">Teams</a> | <a href="tourneys.html">Tournaments</a> | <a href="refs.html">Officials</a> | <a href="mailto:youremail@yourISP.com">Contact Us</a> </u></p> creates an in-line nav bar. Try replacing the vertical pipes with your chosen image to see what would happen. Sorry, I didn't try myself, but I would be interested in knowing if it works. Might have to insert CODE before and after your images to space them out visually.Hope this helps. Just so happens that it worked for me. Only thing is, I'm not certain the forum would want me to post the entire page here, so if you were to pm me with your email address, then I will forward a zip file to you containing the full sample page. Hope I can be of some use around here...  Well, in case someone else want to view the code, here it is : CODE <p id="nav"><u> <img src="your_image.gif" width="10"> <a href="index.html">Home</a> <img src="your_image.gif" width="10"> <a href="contacts.html">Contact List</a> <img src="your_image.gif" width="10"> <a href="teams.html">Teams</a></p> You should be able to enhance this paragraph tag with rollover effects by utilizing css rules like Lozbo posted in the first posting. That I didn't try, but I might get a chance to test for that tomorrow. Stay tuned.... QUOTE(jlhaslip @ Sep 18 2005, 12:38 AM) You should be able to enhance this paragraph tag with rollover effects by utilizing css rules like Lozbo posted in the first posting. That I didn't try, but I might get a chance to test for that tomorrow. Stay tuned.... And, yes, the a:hover { color: #pick one; bacground-color: #pickone;} does work with this html/css code. So today was not a total waste, I've learned something... thanks for the question. I have enjoyed this exercise and hope it works for you... This post has been edited by BuffaloHELP: Sep 18 2005, 10:13 PM |
|
|
|
|
Sep 19 2005, 03:48 PM
Post
#8
|
|
|
Super Member Group: Members Posts: 282 Joined: 1-September 05 From: Wanatos Member No.: 11,382 |
Thanks jlhaslip, i know i can do that, but the thing was to keep the links as a list, not as separate paragraphs or lines, but thanks any way for your help.
As i told ya in a personal message, what ive found reading here and there is that this was not possible, that if your inline a list, the bullet will always go away, though im not entirely sure, so if some one knows about this please drop a message so we can close this thread. |
|
|
|
|
Similar Topics