Link to home
Start Free TrialLog in
Avatar of David Schure
David Schure

asked on

Multi Choice Box Arrangement Problems

I am trying to somewhat duplicate this from Demi Lovato's site.

http://www.demilovato.com/

When you open the site there is a button called "Out Now"  when you click on it. You get a choice of music services.  I kind of have the basic layout.  Problem is the "Listen buttons are underneath the logos as opposed to being next to them.  The other problem is that it's a hot mess on the phone!  Sizes and everything else are all over the place.   It should mimic Demi's site on the phone and the desktop. (The logos and the listen.

<section id="music" class="container">
        <!-- player code -->
        <div id="hap-wrapper">

<div>
		<div><img src ="media\SingleCover2.jpg"></div>	
	<div>
	<h4>Alessandro Coli</h4>
	<div>#permission</div>
    <div>Select A Music Service</div>
	</div>
</div>

<div class="service">
  	<img src ="socials\music-service_amazon.svg">
  	<span>...</span>
  	<span class="play" style="float:right" >Listen</span>
</div>

<div class="service">  
	<img src ="socials\music-service_applemusic.svg">
	<span>...</span>
  	<span class="play">Listen</span>
</div>

<div class="service"> 
  	<img src ="socials\music-service_deezer.svg">
	<span>...</span>
  	<span class="play">Listen</span>
</div>

<div class="service"> 
  	<img src ="socials\music-service_google-play.svg">
    <span>...</span>
  	<span class="play">Listen</span>
</div>

<div class="service"> 
  	<img src ="socials\music-service_itunes.svg">
    <span>...</span>
  	<span class="play">Listen</span>
</div>

<div class="service"> 
  	<img src ="socials\music-service_pandora.svg">
    <span>...</span>
  	<span class="play">Listen</span>
</div>

<div class="service"> 
  	<img src ="socials\music-service_spotify.svg">
    <span>...</span>
  	<span class="play">Listen</span>
</div>

<div class="service"> 
  	<img src ="socials\music-service_tidal.svg">
    <span>...</span>
  	<span class="play">Listen</span>
</div>

<div class="service"> 
  	<img src ="socials\music-service_youtube.svg">
  	<span>...</span>
  	<span class="play">Listen</span>
</div>
                    <!--/div-->
                <!--/div-->
            </div>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of David Schure
David Schure

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial