여러번 시도해보고 노력했으나 잘 안되네요;

부탁드립니다~

 

<div style="border: 1px solid black; width: 450px; font-size: 15px;"><div style="background-color: skyblue;"><div style="height: 60px;"></div><div style="padding: 1em; text-align: center;">불타는군단 타우렌 드루이드 Trr</div><div style="padding: 1em; text-align: center;"><div style='background: url("첫 상자 이미지"); margin: 0px 15px; border-radius: 10px; border: 3px solid white; width: 92px; height: 92px; overflow: hidden; display: inline-block; border-image: none;'><div style="transition:0.4s; width: 92px; height: 92px; color: rgba(255, 255, 255, 0); vertical-align: middle; display: table-cell;" data-inven-over-css="{'_SELF_':{'background-color':'red','color':'rgba(255,255,255,1)'}}" data-inven-out-css="{'_SELF_':{'background-color':'rgba(255,255,255,0)','color':'rgba(255,255,255,0)'}}"><div style="padding: 0.5em;">가입일<br /><span style="font-weight: bold;">D + </span><span style="font-weight: bold;" data-inven-dday="2005-05-12"></span></div></div></div><div style='background: url("둘째 상자 이미지"); margin: 0px 15px; border-radius: 10px; border: 3px solid white; width: 92px; height: 92px; overflow: hidden; display: inline-block; border-image: none;'><div style="transition:0.4s; width: 92px; height: 92px; color: rgba(255, 255, 255, 0); vertical-align: middle; display: table-cell;" data-inven-over-css="{'_SELF_':{'background-color':'blue','color':'rgba(255,255,255,1)'}}" data-inven-out-css="{'_SELF_':{'background-color':'rgba(255,255,255,0)','color':'rgba(255,255,255,0)'}}"><div style="margin: 0px; padding: 0px; border: 0px currentColor;" data-inven-action="" data-inven-nick-default="trr"><span style="display: none;" data-inven-attr-for="input"></span><span style='margin: 0px; padding: 0px; border-radius: 123px; border: 0px currentColor; transition:0.4s; width: 92px; height: 92px; color: rgba(255, 255, 255, 0); font-family: "Jeju Gothic", sans-serif; font-size: 15px; background-color: rgba(255, 255, 255, 0);' data-inven-over-css="{'_SELF_':{'color':'rgba(255,255,255,1)'}}" data-inven-out-css="{'_SELF_':{'color':'rgba(255,255,255,0)'}}" data-inven-attr-for="last-attack-all" data-inven-text="마격"></span></div></div></div><div style='background: url("셋째 상자 이미지"); margin: 0px 15px; border-radius: 10px; border: 3px solid white; width: 92px; height: 92px; overflow: hidden; display: inline-block; border-image: none;'><div style="transition:0.4s; width: 92px; height: 92px; color: rgba(255, 255, 255, 0); vertical-align: middle; display: table-cell;" data-inven-over-css="{'_SELF_':{'background-color':'green','color':'rgba(255,255,255,1)'}}" data-inven-out-css="{'_SELF_':{'background-color':'rgba(255,255,255,0)','color':'rgba(255,255,255,0)'}}"><div style="margin: 0px; padding: 0px; border: 0px currentColor;" data-inven-action="" data-inven-nick-default="trr"><span style="display: none;" data-inven-attr-for="input"></span><span style='margin: 0px; padding: 0px; border-radius: 123px; border: 0px currentColor; transition:0.4s; width: 92px; height: 92px; color: rgba(255, 255, 255, 0); font-family: "Jeju Gothic", sans-serif; font-size: 15px; background-color: rgba(255, 255, 255, 0);' data-inven-over-css="{'_SELF_':{'color':'rgba(255,255,255,1)'}}" data-inven-out-css="{'_SELF_':{'color':'rgba(255,255,255,0)'}}" data-inven-attr-for="send-note" data-inven-text="쪽지"></span>

 

 

전체배경은 이걸로 하고싶구요

 

 

 

 

가운데 원형 이미지

 

 

 

하단 3칸중 첫번째 이미지입니다

 

 

 

두번째 이미지이구요

 

세번째 이미지입니다

 

가운데 이미지가 너무 안맞는것같은데 줄이거나 원형으로 만드는걸 못하겠습니다..

저 상태로 넣으면 너무 안어울릴것같은데..줄이는걸 못하겠네요.

편하신대로 작업해주시면 감사하겠습니다.

영 안맞으면 삭제하셔도 괜찮습니다.

무더운 여름 건강하세요.