"Выровнять текст: по центру;"заставляет мою правую кнопку уходить со страницы - PullRequest
0 голосов
/ 13 июля 2011

Я неистово гуглил свою проблему, и я не могу решить эту проблему.

Я создал iFrame, который прокручивает 8 изображений с помощью кнопок со стрелками влево и вправо. Когда я text-align: center; DIV, который содержит изображения, стрелка вправо (# leaf2) исчезает.

Вот мой HTML,

<html>
<body>

<div id="leaf1"><button onClick="image_onclick('prev');"><img src="images/leaf.gif/></button</div>
<div id="image_box"></div>
<div id="leaf2"><button onClick="image_onclick('next');"><img src="images/leaf2.gif"/></button></div>

</body>
</html>

Вот мой CSS,

body, p, image{
    margin: 0;
    padding: 0;
}

button{
    background-color: #ffffff;
    border: 0;
}

#image_box{
    text-align: center;
}

#image_box img{
    border: 1px solid black;
}

#leaf1{
    position: absolute;
    margin: 155px 0 0 8px;
}

#leaf2{
    position: absolute;
    margin: 160px 0 0 850px;
}

Ответы [ 2 ]

1 голос
/ 13 июля 2011

Я не уверен, что это была ошибка при копировании, но у вас есть Кнопка </ </div> вместо

Кроме того, если вы пытаетесь центрировать изображения в вашем image_box, вам нужно установить для левого и правого полей значение auto. Итак:

            image_box img{
                margin: 0 auto; /* or margin-left:auto; margin-right:auto; */
                border: 1px solid black;
            }
0 голосов
/ 13 июля 2011

Здесь есть пара синтаксических проблем:

<img src="images/leaf.gif/></button</div>

По-разному ли отображается страница при закрытии атрибута src и элемента <button>?

<img src="images/leaf.gif"/></button></div>

Также обратите внимание, что в соответствии с кодом, который вы разместили, вы применяете text-align: center к пустому div.

...