html - Add Text on Border -


so have image , text inside border. i'm trying have word on border , can't seem find way of doing it.

my html

<div class="img">         <img src="https://imagizer.imageshack.us/v2/321x396q90/661/ouf8n3.jpg" align="left" height=400px width=400px alt="sliced">         <div class="text">             calibre: 1 5 mm <br>              packing: jute or polypropylene bags , vacuum & carton <br>              usage areas: used raw material processed , processed hazelnuts, etc. <br>         </div>         <h2> sliced </h2> </div> 

css

.img {    float: left;    border-style: solid;    border-width: 2px;    border-color: 24ab36;    padding: 20px; } 

i want header 2 on border.

how do ?

if want text on border ,you can use fieldset

see demo

<fieldset>      <legend>title text</legend>         content here  </fieldset>

html:

<fieldset class="field_set">     <legend style="text-align: center;"><h2>sliced</h2></legend>     <div class="img">         <img src="https://imagizer.imageshack.us/v2/321x396q90/661/ouf8n3.jpg" align="left" height=400px width=400px alt="sliced">         <div class="text">             calibre: 1 5 mm <br>              packing: jute or polypropylene bags , vacuum & carton <br>              usage areas: used raw material processed , processed hazelnuts, etc. <br>         </div>        </div> </fieldset> 

css:

.img {    float: left;    padding: 20px; }  .field_set{     border-width:6px;     border-color:#f00;     border-style: solid;  } 

Comments

Popular posts from this blog

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -

ubuntu - Selenium Node Not Connecting to Hub, Not Opening Port -