Jump to content

Search the Community

Showing results for tags 'list'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


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

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start





Website URL








Found 17 results

  1. Hello. I don't understand, why ul element has a style overflow: hidden? And if I delete it, then background-color won't work, why? Could you tell please how does it work? Thank you in advance for your help. This example is from here: https://www.w3schools.com/html/tryit.asp?filename=tryhtml_lists_menu <head> <style> ul { list-style-type: none; overflow: hidden; background-color: #333333; } li { float: left; } li a { display: block; color: white; text-align: center; text-decoration: none; } </style> </head> <body> <ul> <li><a href="#home">Home</a></li> <li><a href="#news">News</a></li> <li><a href="#contact">Contact</a></li> <li><a href="#about">About</a></li> </ul> </body>
  2. Dear all, Unfortunately I never learned programming properly, but I sometimes use XML to add custom content controls to Word documents and it is extremely useful to me. In Word I use the Developer > XML mapping pane - and the on the right side - XML mapping > Custom XML part to add my XML code (usually a simple .txt file) selecting the (Add new part...) from the dropdown list. Now say that I added the following code: <?xml version="1.0" encoding="UTF-8" standalone="no"?> <XMLname xmlns="XMLID"> <item1>This is my custom XML part. It helps me greatly. I'd like to improve my knowledge and my codes.</item1> <item2></item2> </XMLname> So far so good, if I insert 'item2' as a Rich Text content control, it gives me an empty field I can freely edit. But here come my two problems: If I insert 'item1' as a Rich Text content control, it gives me a field filled with the text I set, and it will look like this: QUESTION 1: The above result is still useful (since I can edit the field as I see fit), but is there a way to add a line break? So, what I'd like to see is: Is there a simple way in XML to do this (without adding a new tag)? Something like the '\n' in HTML? QUESTION 2: Is there a simple way to make a list of the text? Again, like the <ul> tag in HTML, but without using additional tags. So for example And if there is a way, how can I add different list styles and subpoints to the points? Thank you all in advance, a simple answer to question 1 would help me a lot.
  3. Hello, I'm trying to make a to-do list that saves the entries on the server/in the cloud so the same added items can be viewed on different devices. I researched a bit on LocalStorage but I realized it's just local, obviously. So how do I make it so my site stores the added items on the server?
  4. I have 2 lists I am trying to complete in my website. The first list I have is a navigation bar that runs horizontally. I have all of the css and html for that. In addition, under my gallery division I am trying to add another list to replace my table and make it layout similar to the table. When I add my list it is effected by the navigation bar css. To remedy this I added a class to the division that carries nav bar and added that syntax to my list css such as <div class="nav"> and nav, ul {}. This doesn't seem to be helping though. I don't want to give a class for every li or ul and I'm sure it is an easy fix but I need some help. <!DOCTYPE html> <html> <head> <style> * { box-sizing: border-box; } .header, .footer { background-color: #333;; color: lightgrey; padding: 50px; clear: both; } a {color:white;} .clearfix::after { content: ""; clear: both; display: table; } nav, ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333; position: fixed; top: 0; width: 100%; } .nav, li { float: left; font-family: arial; } .nav, li a { display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none; } li a:hover { background-color: #111; } #border1 { border: 3px solid #2990EA; padding: 10px; } .birthday { float: left; margin-right: 100px; margin-left: 400px; width:500px; } .footer a { text-decoration: none; clear: both; } .column { background-color: #ebecf6; overflow: hidden; clear: both; } .container { background-color:#909ca2; } div.gallery img { width: 300px; height: 250px; padding: 5px; float: left; margin-bottom: 50px; } .gallery1 { margin-left: 500px; } .table1 { padding:100px; } th { font-size: 200%; } tr { font-size: 150%; } tr, p { margin-left: 200px; } </style> </head> <body style="font-family: sans-serif;"> <div class="nav"> <ul> <li class="li" style="float:right"><a href="#about school">ABOUT SCHOOL</a></li> <li class="li" style="float:right"><a href="#about family">ABOUT FAMILY</a></li> <li class="li" style="float:right"><a href="#about me">ABOUT ME</a></li> <li id="border" style="float:right"><a href="#home">HOME</a></li> </ul> </div> <div class="header"> <h1 style="color: #e9cf76;text-align:center;font-size:300%">About Me</h1> </div> <div class="container"> <div class="gallery"> <img class="gallery1" src="bun.jpg" alt="Trolltunga Norway" width="100" height="100"> </div> <div class="gallery"> <img src="3eb.jpeg" alt="Trolltunga Norway" width="100" height="100"> <div class="gallery"> <img src="westworld.jpg" alt="Trolltunga Norway" width="100" height="100"> </div> <div class="list1"> <ul> <li>Technology Teacher</li> <li>Previously a Manager</li> </ul> <ul> <li>Lamb Karahi</li> <li>Pho Thai</li> </ul> </div> <div class="table1"> <table style="width:100%"> <tr> <th>Job</th> <th>Food</th> </tr> <tr> <td><p>Technology Teacher</p></td> <td><p>Lamb Karahi</p></td> </tr> <tr> <td><p>Previously a Manager</p></td> <td><p>Pho Thai</p></td> </tr> </table> </div> </div> <div class="column content"> <img class="birthday" src="birthday.jpg"> <h1 style="text-align:center;font-size:300%">Who am I?</h1> <p style="font-size: 150%">I have two children and a third on the way. My oldest child's name is Harper and her brother is called Nolan. The third baby gender is a mystery to all but me, and no I won't tell you! Minus the lack of sleep being a parent is the best thing that ever happened to me.</p> <p style="font-size: 150%"> teach technology at MMSA. I am one of the few teachers who can say that they have taught every single grade level. I graduated from Wayne State University with a Bachelor's Degree in Secondary Education in 2011. I have been teaching since 2013. </p> </div> </div> <div class="footer"> <p STYLE="text-align:center"><SPAN id="border1"><a href="https://www.weebly.com/" target="_blank">CREATE A FREE WEBSITE</SPAN></a></p> </div> </body> </html>
  5. Hi, I would like to list all the items contained in a folder except for 2 or 3 specific ones. For example, let's say I've item 1, item 2, …, item 10 in /myFolder. I would like to list all the items of /myFolder but item 1, item 3 and item 4. I've come up with the following code which does the work but looks a bit awkward. <?php $dir = '/myFolder'; $filesDir = new FilesystemIterator($dir, FilesystemIterator::SKIP_DOTS); $fileName = ''; foreach ($filesDir as $file) { $fileName = $file->getBasename(); if ($fileName != 'item1' && $fileName != 'item3' && $fileName != 'item4') { echo $fileName.'<br>'; } } Is there a simple and more elegant way to accomplish this? Any help would be appreciated, thanks!
  6. Good Day to All. I have a website to display my artwork and poetry. In the poetry section there is the main page with links to other pages and also an anthology which lists my poems by title, the titles are linked to a page to view the poems in their entirety. When you click the link to any poem, that page also displays the anthology so that you can easily navigate to the next poem that interests you without having to return to the main poetry page. The problem I find myself with is that when I want to add a new poem to the anthology I need to edit every page that contains that list. Not something I am interested in doing. I created the website from scratch several years ago and am just a novice, nothing fancy. I have searched the internet for answers but have yet to find what I am looking for. I would like to create the Anthology as a list of links on a separate page/file that can be referenced/sourced in each poetry page that would display the list. In this manner I only have to edit one page and those changes will reflect on all the associated pages. This is the navigation portion of the code that reflects the links desired; <div id="nav"> <ul> <li><a href="../index.html">Home Page</a></li> <li><a href="../aboutartist.html">About the Artist</a></li> <li><a href="../all-art.html">Gallery</a></li> </ul> <h2>Anthology</h2> <ul> <li><a href="achildcries.html">A Child Cries</a></li> <li><a href="addedupon.html">Added Upon</a></li> <li><a href="brokenflowers.html">Broken Flowers</a></li> <li><a href="deadlovers.html">Dead Lovers</a></li> <li><a href="dreamchaser.html">Dream Chaser</a></li> <li><a href="ebb.html">Ebb</a></li> <li><a href="eyes.html">Eyes</a></li> <li><a href="inthedark.html">In The Dark Recesses of Our Soul</a></li> <li><a href="luna.html">Luna</a></li> <li><a href="myancientpictographs.html">My Ancient Pictographs</a></li> <li><a href="raindrop.html">Rain Drop on the Back Porch Railing</a></li> <li><a href="restlessthenight.html">Restless The Night</a></li> <li><a href="summer.html">Summer</a></li> <li><a href="tameroftheuniverse.html">Tamer of the Universe</a></li> <li><a href="thankyouchild.html">Thank You Child</a></li> <li><a href="theburning.html">The Burning</a></li> <li><a href="unopenedbooks.html">Unopened Books</a></li> <li><a href="whereangelstread.html">Where Angels Tread</a></li> </ul> </div> Ideally, all the links below <h2>Anthology</h2> would be referenced/sourced from a different page/file. My difficulty is two fold. 1. How to source the link. I have tried javascript (which i do not know); <script src="../Poetry List/poetrylist.js"></script> This was the closest thing I could find that might get me where I want. 2. how to create/format the source page that contains the information. currently it is saved as .js Here is the poetry page of the website;http://sagebrushart.com/Poetry.html Any and all help would be greatly appreciated.
  7. Down here the code to call a function it works with list. I dont understand how list works, In my example list gives a survey of 2 arrays that are executed inside the function here is how I call the function: $row = list ($variable, $number) = my_function(); var_dump($row); the output is like this: I need the values separated but how can I list the second array (the one with the numbers) as single numbers outside an own function?
  8. Hello & Thanks , I have a small DropDownList with 3 options . Problem is when I select , let's say , 2nd option . No probs , a new page is opened . If I click on option 1 or 3 , no probs . However , if I click on 2nd option again , instead of clicking on 1 or 2 , no new page is opened . Is there a way to correct this , so that clicking on whatever always opens a new window . Thanks...Vern <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>myFavs-HtmlProbs.html</title> <meta name="Generator" content="PureBasic"> <meta name="Description" content="Your description here..."> <meta name="Description" content="...Created by myFavs % PureBasic..."> <style type="text/css"> </style> </head> <body text="#000000" style="background-color:#A69E80; text-align:center;"> <br> <br> <br> <!--dd <div style=--> <table width="100%" border="0" style="text-align:center" cellspacing="0" cellpadding="0"> <tr style="text-align:center"> <!-- EXAMPLE: <MenuName="aaMost-Used"> --> <!-- rgb(250,240,255) --> <select style="width:200px; font:14px Arial Black; color:rgb(0,0,0); background- color:rgb(231,169,126);" name="menu" onchange="window.open(this.value)"> <option selected="0" value="">aaMost-Used</option> <option value="http://alternativeto.net/">AlternativeToSoftwares</option> <option value="https://www.biblegateway.com/reading-plans/chronological/today? version=NLT">One Year Chronological Bible NLT</option> <option value="http://www.portablefreeware.com/">portablefreeware.com/</option> </select></td></tr></table><br></body></html>
  9. My goal is to loop with foreach through two variables. So I found this script; <?php $abc = array('Mark','Laura'); $add = array('cocktails','champagne'); $array = array($abc,$add); foreach ($array as list($arr1, $arr2)) { // echo '<br>'; echo '<br>'; echo $arr1; echo '<br>'; echo $arr2; } But the output is not wat is desired. It says: And I would rather have: Is there any function / command in the php array reference to do this or should other code be used?
  10. Hi! I would like to create a horizontal list and fill its elements dynamically, so I don't know how many elements the list will contain of. The width of the list is 100% and I'd like to have just one single line. If there are too many elements I would like to make pages, i.e. the list slides to the left and shows the next elements. Is it possible to create such a paging option using css or do I have to code this in Javascript. If its only possible to do it in javascript, how could I realize this? Thank you in advance for your help. loggo
  11. The problem is that I can't get my nav-bar align in the center. This is my code: <div id="nav"><ul><li><a href="startpagina.html">Startpagina</a></li><li><a href="zomercollectie.html">Zomercollectie</a></li><li><a href="wintercollectie.html">Wintercollecite</a></li><li><a href="kerstcollectie.html">Kerstcollectie</a></li><li><a href="contact.html">Contact</a><ul><li><a href="contact-voor-particulieren.html">Contact voor particulieren</a><li><a href="contact-voor-bedrijven.html">Contact voor bedrijven</a> </ul><li><a href="over-ons.html">Over ons</a></li></ul> <br class="clearboth"/></div> .clearboth { margin: 0; padding: 0; clear: both;} #nav { font-family: verdana; font-weight: bold; font-size: 9pt; margin: 10px auto 10px auto; text-align: center;} #nav ul { margin: 0; padding: 0; list-style: none; text-align:center;} #nav a:link,#nav a:visited { color: #ffffff; text-decoration: none;} #nav a { display: block; padding: 6px 8px;} #nav li { float: left; background-color: #44A04D; margin-right: 1px; position: relative; width:15%;} #nav li li{ width: 100%; margin-top: 1px;} #nav li:hover { background-color: #006837;}#nav li li:hover { background-color: #006837;} #nav ul ul { position: absolute; visibility: hidden;} #nav ul ul ul{ position: absolute; left: 100%; top: -2px; border: solid 1px transparent;} #nav li:hover > ul { visibility: visible;} .right-arrow { float: right;} Can anyone solve my problem?
  12. Hello, I am very new to CSS and HTML and have been learning since last week, so i hope someone can help me. I have a list, please see the HTML below, I want to make the list item 'Sparkling', sparkle when hovered over. I thought the CSS code below might make it sparkle, but that makes the entire list sparkle on hover - can anyone help me please?! Thank you! HTML<div class="container_12 clearfix"> <div id="header" class="grid_12"> <h1>Lacosta Wines</h1> <div id"nav"> <ul> <li><a href="index.html">Home</a></li> <li><a href="">Red</a></li> <li><a href="">White</a></li> <li><a id="sparkle" href="">Sparking</a></li> <li><a href="">Fine Wines</a></li> <li><a href="">Wine Tastings</a></li> </ul> </div> </div> CSSa:hover, #sparkle {background-image:url('http://www.addglitter.com/link-sparkle.gif');}
  13. I have a table with two columns and three rows (6 cells). In each cell, I have a "header" and then a list of links. This list can vary from 1 link to 5+ and is subject to change. The client does not like how much white space there is between the the last item in the list, and the next header. I haven't set the cellpadding or cellspacing attributes, so I'd assume that they are 0 since not specified. The attribute that would work perfectly for my solution- cell padding, does not support negative values. :-( Does anyone else have any ideas? Many Thanks,Jg
  14. I'm trying to create a dropdown menu effect here http://cbd-alpha.com/ideal/But I'm stuck with how to get the menu items under the "about" menu item to stack vertically like a standard dropdown. Here's the CSS: #mainNav { margin: 82px 0 0 160px;}#mainNav ul {list-style-type: none;padding-top: 8px;}#mainNav li { float: left; padding-left: 21px;}#mainNav li:first-child { padding-left: 80px; background: none;}#mainNav a { text-decoration: none; padding: 0px 10px; font: normal 14px "ITCAvantGarde", Helvetica, Arial, sans-serif; color: #FFF;}#mainNav ul ul { display: none;}#mainNav ul ul li { padding-left: 0 !important; z-index: 999 !important;}#mainNav ul ul ul { }#mainNav ul ul a { }#mainNav li:hover > a,#mainNav ul ul :hover > a { color: #afc2d1;}#mainNav ul ul a:hover { }#mainNav ul li:hover > ul { display: block;} And here's the css of a similar menu: #mainNav { margin: 0 auto; position: relative; width: 1000px; z-index: 101; } #mainNav ul { border-left: 1px solid #CCCCCC; border-right: 1px solid #FFFFFF; float: left; height: 37px; list-style: none outside none; margin: 0 auto; padding-left: 0; position: relative; z-index: 100; } #mainNav li { border-left: 1px solid #FFFFFF; border-right: 1px solid #CCCCCC; float: left; position: relative; } #mainNav a { color: #8D8C8C; display: block; font: 18px/38px "GothamBoldRegular",Helvetica,Arial,sans-serif; height: 37px; padding: 0 11px; text-decoration: none; text-transform: uppercase; } #mainNav ul ul { border: medium none; display: none; float: left; left: 0; position: absolute; top: 38px; width: 260px; z-index: 99; } #mainNav ul ul li { background: url("images/nav_bg_hover.png") repeat scroll 0 0 transparent; border: medium none !important; float: none; padding: 0 !important; } #mainNav ul ul ul { left: 100%; top: 0; } #mainNav ul ul a { background-image: none !important; border-bottom: 1px dotted #FFFFFF; color: #FFFFFF; font-weight: normal; height: auto; line-height: normal; overflow: hidden; padding: 10px !important; position: relative; text-transform: capitalize; width: 240px; z-index: 99; } #mainNav li:hover { color: #6A99C8; } #mainNav li:hover { background: url("images/nav_a_hover.jpg") repeat-x scroll center bottom transparent; } #mainNav li:hover li { color: #FFFFFF; } #mainNav ul ul li:hover a { background: url("images/nav_bg_hover.png") repeat scroll 0 0 #56A1D5 !important; } #mainNav ul li:hover > ul { display: block; } How do I stack them vertically?
  15. JoReL

    CSS: 2 columns

    I have this menu with tabs on it for deferent info on products. The problems is that in this tab i added a list of two columns, but the info i placed on the list wont show. I dont have problems with the other tabs, thinking there might be a problem on the css or bad sintax.Code on css: #lateral_X{width: 100px;background-color: #CCCCCC;float:left;}#lateral_Y{margin-left:190px;background-color: #FFFFFF;border:#000000 1px solid;} code HTML <div id="panel_02"> <div id="lateral_X"> <li><p>Functions</p></li> <li><p>blablabla</p></li> <li><p>blablabla</p></li> <li><p>*Product</p></li> <li><p>*Product</p></li> <li><p>*Product</p></li> <li><p>*Product</p></li> </div> <div id="lateral_Y"> <li><p>Functons</p></li> <li><p>blablabla</p></li> <li><p>blablabla</p></li> <li><p>*Product</p></li> <li><p>*Product</p></li> <li><p>*Product</p></li> <li><p>*Product</p></li> </div></div>
  16. 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;}
  17. Hello,I'm having an unusual problem with CSS. Here is a picture of a problem. I pointed the "arrows" to these unneeded spaces,there should be just an border together,not having a space. Here is a code: .h-wrapper ul { width: 97%; height: 60px; position: relative; float: left; left:18px; background-color: rgba(50,50,50,0.98); -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; -khtml-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; box-shadow: 0 0 10px rgba(201,150,48,0.75); -moz-box-shadow: 0 0 10px rgba(201,150,48,0.75); -webkit-box-shadow: 0 0 10px rgba(201,150,48,0.75);} .h-wrapper ul li { list-style-type: none; height: 50px; width: 100px; line-height:60px; float: left; text-align: center; border-right: 1px rgb(201, 150, 48 ) solid; border-left: 1px rgb(201,150,48) solid; padding: 5px 0; /* Fixes border cut */} .h-wrapper ul li:hover { background-color:rgba(201,150,48,0.75);} I tried margin,padding,everything,didn't work And the problem isn't at HTML,everything is OK there ^^
  • Create New...