html - No other elements will show up in my section element with a colored background -
i have created < section >
background color of #ff6952
hoping can place image (created in sketch) of timeline of software business called lookout software.
i'm having trouble getting show on top of background color within < section >
. tried inserting img
tag in section , image doesn't show up. tried recreate timeline using unordered list without list styling list elements displayed inline navigation menu. nothing seems show up. note, timeline supposed white.
here's html:
<section id="timeline"> <ul> <li> 1994 - client connect plus founded. </li> <li> 1997 - client connect plus becomes lookout software. </li> <li> 2001 - launched our first product. lots of anticipation. </li> <li> 2006 - big success new product. smiles. </li> <li> 2010 - had tough times survived them. </li> <li> 2013 - things started looking better. brighter days. </li> <li> 2015 - sharepoint crm template becomes sharepoint flex. </li> <li> 2016 - ? </li> </ul> </section>
and css:
#timeline{ height: 700px; width: 100%; background: #ff6952; } #timeline ul li{ color: white; z-index: 100; }
i have tried styling css many different ways, of think futile list here. appreciated.
use snippet show image above color:
background-image:url(http://www.wwwsitus.com/support/img/ampproject.png); background-position:center; background-repeat:no-repeat;
and place inside timeline
follow:
#timeline{ height: 700px; width: 100%; background: #ff6952; /*start: adding image*/ background-image:url(http://www.wwwsitus.com/support/img/ampproject.png); background-position:center; background-repeat:no-repeat; /*end: adding image*/ }
check jsfiddle demo here. btw, use image position center
. can set free (center
, right
, left
or bottom
).
Comments
Post a Comment