2017-01-04 5 views
1

В моем приложении у меня есть мода мода, который я разместил в теге заголовка, в котором у меня есть метка. Между меткой и модальным изображением у меня есть пробел. Когда я запускаю приложение, страница появляется, он будет сидеть в фиксированном положении, но появляется сообщение с надписью. Модальная кнопка изображения перемещается на некоторое расстояние, но сообщение с меткой не отображается, что мода изображения времени приближается к метке. Как я могу изменить стили с и без сообщения метки, или нет, мне нужно исправить положение. Как я могу это сделать, скажите мне.Как я могу исправить свою модальную кнопку изображения

Код:

<h2>Ready To Do:&nbsp;&nbsp;<asp:Label ID="lblMessage" runat="server" ForeColor="Red"></asp:Label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
       &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <img id="myImg" src="image.png" /> </h2><br /> 

style.css

#myImg { 
    border-radius: 5px; 
    cursor: pointer; 
    transition: 0.3s; 
} 

#myImg:hover {opacity: 0.7;} 

image description here
Спасибо

+0

Я не могу понять, что вам нужно, можете ли вы добавить изображение, чтобы показать нам, что вы хотите, пожалуйста? Спасибо –

+0

Привет @ Facundo-la-rocca, я добавил свое изображение, пожалуйста, посмотрите один раз –

+0

Is [this] (http://codepen.io/facundo_larocca/pen/oBNOWy) что вы ищете? –

ответ

0

Ваша проблема в основном связана с тем, что вы используете &nbsp; для интервала.

Для разрешения интервалов вы всегда должны всегда использовать CSS и никогда не полагаться на &nbsp;.

Я бы порекомендовал вам попытку реструктурировать его, указав его внутри элемента блока, например div вместо тега h2.

Что-то вроде ниже будет намного лучше, хотя это только начало:

HTML:

<div class="header"> 
    <h2>Ready to...</h2> 
    <img src="https://i.vimeocdn.com/portrait/58832_300x300" /> 
</div> 

CSS:

.header { 
    width: 100%; 
    text-align: left; 
} 

h2 { 
    float: left; 
} 

img { 
    float: right; 
    height: 40px 
} 

Честно говоря, я рекомендую идти по договоренности макета используя CSS, есть много ресурсов. Надеюсь это поможет.