{"id":9531,"date":"2021-01-21T14:35:49","date_gmt":"2021-01-21T19:35:49","guid":{"rendered":"http:\/\/local.brightwhiz\/?p=9531"},"modified":"2021-12-04T05:38:54","modified_gmt":"2021-12-04T05:38:54","slug":"show-unordered-list-html-without-bullets","status":"publish","type":"post","link":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/","title":{"rendered":"Tip: Properly Display an Unordered List in HTML Without any Bullets"},"content":{"rendered":"\n<p>This is a quick tip to show you the right way to display an ordered or unordered list in <a href=\"http:\/\/local.brightwhiz\/tag\/html\">HTML<\/a> without any bullets or points.<\/p>\n\n\n\n<p>Generally, you can remove bullets from unordered or ordered HTML lists with the <strong>list-style-type<\/strong> <a href=\"http:\/\/local.brightwhiz\/tag\/css\">CSS<\/a> property.<\/p>\n\n\n\n<p>You simply need to apply the <strong>list-style-type<\/strong> CSS property to the <strong>UL<\/strong> selector with a value of none as shown below.<\/p>\n\n\n\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-css\">ul {\n    list-style-type: none;\n}<\/code><\/pre>\n\n\n\n<p><\/p>\n\n\n\n<p>More often than not you need to reposition the rest to make things look better. This can be done by setting the padding and margin CSS properties to zero (0) as seen below.<\/p>\n\n\n\n<pre class=\"wp-block-prismatic-blocks\"><code class=\"language-css\">ul {\n    list-style-type: none;\n    padding: 0;\n    margin: 0;\n}<\/code><\/pre>\n\n\n\n<p><\/p>\n\n\n\n<p>The above code removes the indentation that comes with HTML lists. You can play with the padding and margin to get the best layout according to your theme or template.<\/p>\n\n\n\n<p>That&#8217;s how to properly display an unordered list in HTML without any bullets.<\/p>\n\n\n\n<p>Ref: [<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/list-style-type\" target=\"_blank\" rel=\"noreferrer noopener\">1<\/a>]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This is a quick tip to show you the right way to display an ordered or unordered list in HTML without any bullets or points. Generally, you can remove bullets&#8230;<\/p>\n","protected":false},"author":1,"featured_media":9532,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2,23,27,16,17],"tags":[170,303,635,637],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.3 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Tip: Properly Display an Unordered List in HTML Without any Bullets<\/title>\n<meta name=\"description\" content=\"This is a quick tip to show you the right way to display an ordered or unordered list in HTML without any bullets or points\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Tip: Properly Display an Unordered List in HTML Without any Bullets\" \/>\n<meta property=\"og:description\" content=\"This is a quick tip to show you the right way to display an ordered or unordered list in HTML without any bullets or points\" \/>\n<meta property=\"og:url\" content=\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/\" \/>\n<meta property=\"og:site_name\" content=\"Brightwhiz.com\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/brightwhiz\/\" \/>\n<meta property=\"article:published_time\" content=\"2021-01-21T19:35:49+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-12-04T05:38:54+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Michael Bright\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@brightwhizmag\" \/>\n<meta name=\"twitter:site\" content=\"@brightwhizmag\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Michael Bright\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#article\",\"isPartOf\":{\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/\"},\"author\":{\"name\":\"Michael Bright\",\"@id\":\"http:\/\/local.brightwhiz\/#\/schema\/person\/81f0f3126f13834ae2e7f381b3028e32\"},\"headline\":\"Tip: Properly Display an Unordered List in HTML Without any Bullets\",\"datePublished\":\"2021-01-21T19:35:49+00:00\",\"dateModified\":\"2021-12-04T05:38:54+00:00\",\"mainEntityOfPage\":{\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/\"},\"wordCount\":150,\"publisher\":{\"@id\":\"http:\/\/local.brightwhiz\/#organization\"},\"image\":{\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#primaryimage\"},\"thumbnailUrl\":\"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg\",\"keywords\":[\"CSS\",\"HTML\",\"Web\",\"Web Design\"],\"articleSection\":[\"Articles\",\"Guides\",\"Programming\",\"Technology\",\"Tips\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/\",\"url\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/\",\"name\":\"Tip: Properly Display an Unordered List in HTML Without any Bullets\",\"isPartOf\":{\"@id\":\"http:\/\/local.brightwhiz\/#website\"},\"primaryImageOfPage\":{\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#primaryimage\"},\"image\":{\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#primaryimage\"},\"thumbnailUrl\":\"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg\",\"datePublished\":\"2021-01-21T19:35:49+00:00\",\"dateModified\":\"2021-12-04T05:38:54+00:00\",\"description\":\"This is a quick tip to show you the right way to display an ordered or unordered list in HTML without any bullets or points\",\"breadcrumb\":{\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#primaryimage\",\"url\":\"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg\",\"contentUrl\":\"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg\",\"width\":1200,\"height\":630,\"caption\":\"Unordered List in HTML Without any Bullets\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"http:\/\/local.brightwhiz\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Tip: Properly Display an Unordered List in HTML Without any Bullets\"}]},{\"@type\":\"WebSite\",\"@id\":\"http:\/\/local.brightwhiz\/#website\",\"url\":\"http:\/\/local.brightwhiz\/\",\"name\":\"Brightwhiz.com\",\"description\":\"Best Tech guides, Tutorials, and News\",\"publisher\":{\"@id\":\"http:\/\/local.brightwhiz\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"http:\/\/local.brightwhiz\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"http:\/\/local.brightwhiz\/#organization\",\"name\":\"Brightwhiz\",\"url\":\"http:\/\/local.brightwhiz\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"http:\/\/local.brightwhiz\/#\/schema\/logo\/image\/\",\"url\":\"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/11\/brightwhiz-com-logo-orange.png\",\"contentUrl\":\"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/11\/brightwhiz-com-logo-orange.png\",\"width\":706,\"height\":135,\"caption\":\"Brightwhiz\"},\"image\":{\"@id\":\"http:\/\/local.brightwhiz\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/brightwhiz\/\",\"https:\/\/twitter.com\/brightwhizmag\",\"https:\/\/instagram.com\/bright_whiz\/\",\"https:\/\/www.pinterest.com\/sobbayi\/\",\"https:\/\/www.youtube.com\/channel\/UC6sCdP_d_RiTIM7ErFT-PSQ\"]},{\"@type\":\"Person\",\"@id\":\"http:\/\/local.brightwhiz\/#\/schema\/person\/81f0f3126f13834ae2e7f381b3028e32\",\"name\":\"Michael Bright\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"http:\/\/local.brightwhiz\/#\/schema\/person\/image\/\",\"url\":\"http:\/\/1.gravatar.com\/avatar\/da90485875ff0aafa38fdd494abe87d1?s=96&d=mm&r=g\",\"contentUrl\":\"http:\/\/1.gravatar.com\/avatar\/da90485875ff0aafa38fdd494abe87d1?s=96&d=mm&r=g\",\"caption\":\"Michael Bright\"},\"sameAs\":[\"https:\/\/sobbayi.com\"],\"url\":\"http:\/\/local.brightwhiz\/author\/sobbayiadmin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Tip: Properly Display an Unordered List in HTML Without any Bullets","description":"This is a quick tip to show you the right way to display an ordered or unordered list in HTML without any bullets or points","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/","og_locale":"en_US","og_type":"article","og_title":"Tip: Properly Display an Unordered List in HTML Without any Bullets","og_description":"This is a quick tip to show you the right way to display an ordered or unordered list in HTML without any bullets or points","og_url":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/","og_site_name":"Brightwhiz.com","article_publisher":"https:\/\/www.facebook.com\/brightwhiz\/","article_published_time":"2021-01-21T19:35:49+00:00","article_modified_time":"2021-12-04T05:38:54+00:00","og_image":[{"width":1200,"height":630,"url":"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg","type":"image\/jpeg"}],"author":"Michael Bright","twitter_card":"summary_large_image","twitter_creator":"@brightwhizmag","twitter_site":"@brightwhizmag","twitter_misc":{"Written by":"Michael Bright","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#article","isPartOf":{"@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/"},"author":{"name":"Michael Bright","@id":"http:\/\/local.brightwhiz\/#\/schema\/person\/81f0f3126f13834ae2e7f381b3028e32"},"headline":"Tip: Properly Display an Unordered List in HTML Without any Bullets","datePublished":"2021-01-21T19:35:49+00:00","dateModified":"2021-12-04T05:38:54+00:00","mainEntityOfPage":{"@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/"},"wordCount":150,"publisher":{"@id":"http:\/\/local.brightwhiz\/#organization"},"image":{"@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#primaryimage"},"thumbnailUrl":"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg","keywords":["CSS","HTML","Web","Web Design"],"articleSection":["Articles","Guides","Programming","Technology","Tips"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/","url":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/","name":"Tip: Properly Display an Unordered List in HTML Without any Bullets","isPartOf":{"@id":"http:\/\/local.brightwhiz\/#website"},"primaryImageOfPage":{"@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#primaryimage"},"image":{"@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#primaryimage"},"thumbnailUrl":"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg","datePublished":"2021-01-21T19:35:49+00:00","dateModified":"2021-12-04T05:38:54+00:00","description":"This is a quick tip to show you the right way to display an ordered or unordered list in HTML without any bullets or points","breadcrumb":{"@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#primaryimage","url":"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg","contentUrl":"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/01\/without-any-bullets.jpg","width":1200,"height":630,"caption":"Unordered List in HTML Without any Bullets"},{"@type":"BreadcrumbList","@id":"http:\/\/local.brightwhiz\/show-unordered-list-html-without-bullets\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"http:\/\/local.brightwhiz\/"},{"@type":"ListItem","position":2,"name":"Tip: Properly Display an Unordered List in HTML Without any Bullets"}]},{"@type":"WebSite","@id":"http:\/\/local.brightwhiz\/#website","url":"http:\/\/local.brightwhiz\/","name":"Brightwhiz.com","description":"Best Tech guides, Tutorials, and News","publisher":{"@id":"http:\/\/local.brightwhiz\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"http:\/\/local.brightwhiz\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"http:\/\/local.brightwhiz\/#organization","name":"Brightwhiz","url":"http:\/\/local.brightwhiz\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/local.brightwhiz\/#\/schema\/logo\/image\/","url":"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/11\/brightwhiz-com-logo-orange.png","contentUrl":"http:\/\/local.brightwhiz\/wp-content\/uploads\/2021\/11\/brightwhiz-com-logo-orange.png","width":706,"height":135,"caption":"Brightwhiz"},"image":{"@id":"http:\/\/local.brightwhiz\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/brightwhiz\/","https:\/\/twitter.com\/brightwhizmag","https:\/\/instagram.com\/bright_whiz\/","https:\/\/www.pinterest.com\/sobbayi\/","https:\/\/www.youtube.com\/channel\/UC6sCdP_d_RiTIM7ErFT-PSQ"]},{"@type":"Person","@id":"http:\/\/local.brightwhiz\/#\/schema\/person\/81f0f3126f13834ae2e7f381b3028e32","name":"Michael Bright","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/local.brightwhiz\/#\/schema\/person\/image\/","url":"http:\/\/1.gravatar.com\/avatar\/da90485875ff0aafa38fdd494abe87d1?s=96&d=mm&r=g","contentUrl":"http:\/\/1.gravatar.com\/avatar\/da90485875ff0aafa38fdd494abe87d1?s=96&d=mm&r=g","caption":"Michael Bright"},"sameAs":["https:\/\/sobbayi.com"],"url":"http:\/\/local.brightwhiz\/author\/sobbayiadmin\/"}]}},"_links":{"self":[{"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/posts\/9531"}],"collection":[{"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/comments?post=9531"}],"version-history":[{"count":0,"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/posts\/9531\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/media\/9532"}],"wp:attachment":[{"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/media?parent=9531"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/categories?post=9531"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/local.brightwhiz\/wp-json\/wp\/v2\/tags?post=9531"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}