CODEWITHSUNDEEP
javascriptcss
user1364441
user1364441

Reputation: 85

Need help on CSS to place these elements correctly

I have a css issue which I can't seem to figure out. I have a link to the application [here][1].

To use the app, just select a file (a small file for quick upload) and then click on the "Upload" button to upload the file. What you then see is the name of the file you have uploaded, the delete button and a horizontal line underneath.

But what I want is the name of the file to stay left like it is doing now, move the delete button to align right hand side inside the box and except using a horizontal line can that be replaced by using a dotted line?

Below is the code where the filename, delete button and horizontal line is appended in:

<ul class='listImage' align='left'>

Below is the code which displays the filename, delete button and hozizontal line:

 $('.listImage').append(htmlEncode(imagefilename) + '<button align="right" type="button" class="deletefileimage">Delete</button><br/><hr/>');

Below is the current css for the listImage and delete button:

.deletefileimage{
    font-size:12px;
    font-weight:bold;   
}

.listImage{
    font-size:12px;
    text-align:left;
    margin:0;
    padding-left:0;

}

Upvotes: 1

Views: 62

Answers (2)

ShibinRagh
ShibinRagh

Reputation: 6646

align='left' property is not good for browser capability , use float:left; float:right;

Upvotes: 0

Idrizi.A
Idrizi.A

Reputation: 12010

replace

<button align="right" type="button" class="deletefileimage">Delete</button>

with 

<button style="float:right" type="button" class="deletefileimage">Delete</button>

Upvotes: 1

Related Questions