I need to make a page like in iTunes store: Link to the picture

I do this: jsfiddle

* { margin: 0; padding: 0; } body { background: #222; } #album_page { background: #222; width: 100%; height: 100%; } #album_page .album_info { color: #FFF; position: absolute; left: 250px; top: 30px; } #album_page .album_hr { width: 100%!important; height: 1px; background: rgba(255, 255, 255, 0.12); border-bottom: 1px solid rgba(29, 28, 28, 0.91); position: relative; z-index: 4; box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.44); } #album_page .album_img { background-image: url('https://pp.vk.me/c5706/u84702241/a_1274e7c6.jpg'); position: relative; width: 200px; height: 200px; z-index: 5; left: 30px; top: 30px; border-radius: 1px; -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 1); box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 1); } #album_page .album_tabs { display: block; margin-top: 80px; } #album_page .album_tabs a { color: #8B8B8B; text-decoration: none; font-weight: bold; } #album_page .album_tabs a:hover { text-decoration: underline; } #album_selection { margin-left: 75px; } #album_selection a.album_buy { border: 1px solid #F4F4F4; text-align: center; color:#FFF; text-decoration: none; padding: 5px; } 
 <div id="album_page"> <span class="album_info"> <font color="gold">Альбом 1</font> <br/> Год выпуска: 2009 <br/> Количество песен: 12 <span class="album_tabs"><a href="#">Песни</a> <a href="#">Отзывы</a></span> </span> <div class="album_img"></div> <div class="album_hr"></div> </div> <br/> <br/> <div id="album_selection"> <a class="album_buy" href="#">Купить альбом</a> <br/> <br/>text</div> 

I can’t add marked blocks to the page. Please help me design this design.

  • @Maqsood can you still add "marked blocks" at least somehow ... but something more like work for you. - zb '
  • @eicto, I updated the link, my code works correctly in Google Chrome browser - Maqsood
  • and it works correctly in firefox, what's the problem then? - zb '

0