Am trying to customize bullets in<ul> with image, and image appears in its actual size what might be problem or what should I do | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 2

Am trying to customize bullets in<ul> with image, and image appears in its actual size what might be problem or what should I do

11th May 2020, 8:23 AM
Gordon Okoth Agola
Gordon Okoth Agola - avatar
3 Answers
+ 3
Gordon Okoth Agola I think you should use any image editor and then resize your images. That might help. However, you can add your code too in case I try to find any alternative :))
11th May 2020, 8:33 AM
Arb Rahim Badsa
Arb Rahim Badsa - avatar
+ 2
<!DOCTYPE html> <html> <head> <link href="h1.css" rel="stylesheet"> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>Recipe of Beef Pilau By Gordon</title> </head> <body> <h1>BEEF PILAU</h1> <p class="p1"> Pilau is a Kenyan food which originate from coast because of their love for spices. <br />It can be prepared from beef & rice or chicken & rice or just rice alone</p> <!.. ingredients using unerdered list..> <div class="In" >INGREDIENTS</div> <ul id="unordered"> <li >250g beef</li> <li>2 onions chops</li> <li>400g pishori rice, washed and soaked for 15 minutes.</li> <li>1/2 tsp turmeric powder</li> <li>1/2tsp corriander powder</li> <li> 1/2tsp cummin piwder</li> <li>vegetable cooking oil</li> <li>1/2tsp garlic paste</li> <li>chopped coriander</li> <li>3 tomatoes</li> <li>whole spices</li> <li>1 TBS cumin</li> <li>2 cinnamon sticks</li> <li>2 cloves 2 cardamon</li> <li>1/2tsp whole pepper</li> </ul> <div class="pro">PROCEDURE<
11th May 2020, 8:36 AM
Gordon Okoth Agola
Gordon Okoth Agola - avatar
+ 2
body{ background: repeating-linear-gradient(45deg,white 20px,yellow 30px); } h1{ background-color: teal; } .pro,.In{ color:darkgreen; } #order{ padding:20px 10px 20px 10px; list-style-type: lower-roman; background-color: coral; } #unordered{ padding:20px 10px 20px 10px; list-style-image: url("download/img.jpg"); background-color: coral; } .p1{padding:20px 10px 20px 10px; background-color: darkkhaki; } .span span{ font-style: italic; } .span span:last-child{ text-decoration: underline; } .bottom {padding:20px 10px 20px 10px; background-color: antiquewhite; } .bottom p{ background-color: cyan; }
11th May 2020, 8:39 AM
Gordon Okoth Agola
Gordon Okoth Agola - avatar