如何使用CSS

-5

显示在一行按钮和图像这是我的JavaScript代码：如何使用CSS

$('#needdiv').append('<img src="/images/Connect.png" id="connectimage">' + '</img>' 
     + '<input type="button" id="connect" value=connect >' + '</input>' 
     + '<img src="/images/Remove.png" id="removeimage" />' 
     + '<input type="button" id="remove" value="remove">'+'</input>');

在我的HTML页面有：

<div id=needdiv></div>

这是CSS

#connectimage  
    {float:left;  
    vertical-align:left; 
    } 
    #connect 
    { text-decoration:none; 
    vertical-align:middle; 
    } 
    #removeimage 
    { 
    vertical-align:middle; 
    } 

    #remove 
    { 
    vertical-align:right; 
    }

如何在单行显示此图像和按钮？我需要connect image在左边，connect button和remove image在中间，remove button在右边。但都在一条线上。

来源

2014-07-22 user3855674

尝试使用html'

''table-layout：fixed'，以便您可以准确定义单元格的宽度。 – mechalynx

提供CSS和HTML + jsfiddle。 –

请正确指出您的问题，上传您想要获取的图片？你的意思是“左侧连接图像，连接按钮，中间移除图像，右侧移除按钮”。什么中间和左边？ – SarathSprakash

回答

First you put one Div element for whole content set width as 100% 
and indise div for img tag 50% and Button 50% .It should work 


CSS: 

#needdiv 
{ 
width:100%; 
display:block; 
} 

#needdiv img 
{ 
float:left; 
} 
#needdiv input 
{ 
float:right; 
}

来源

2014-07-22 11:54:28 prakash

如果你想所有的构件用同样的那面显示的一面，你可以应用CSS样式到所有的人，并使用float属性（小提琴：http://jsfiddle.net/G2rRa/）：

#needdiv img, #needdiv input { 
    float: left; 
}

或者，你可以还可以使用display属性（小提琴：http://jsfiddle.net/G2rRa/1/）：

#needdiv img, #needdiv input { 
    display: inline; 
}

您可以使用CSS margin属性到元素之间调整间距：

#needdiv img, #needdiv input { 
    float: left; 
    margin: 0px 10px; 
}

来源

2014-07-22 11:53:27

如何使用CSS

回答

相关问题