Форум русской поддержки Joomla!® CMS
04.12.2016, 10:15:39 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 3.0 FAQ Joomla 2.5 FAQ Joomla 1.5 FAQ Правила форума Новости Joomla Реклама Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор

Как отобразить картинку справа от div?

 (Прочитано 107 раз)
0 Пользователей и 1 Гость смотрят эту тему.
Ferum1
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 49


« : 27.09.2016, 22:50:53 »

Не получается картинку (638535328.jpg) расположить справа от div, переходит на следующую строку и все...
прилагаю HTML и CSS

Код:
<!DOCTYPE HTML>
<html>
<head>

<meta charset="utf-8">

<link rel="stylesheet" type="text/css" href="style.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300|Roboto" rel="stylesheet">

<title>Страница авторизации</title>

</head>
<body>
<header>
<h1>АСУ ПК</h1>
</header>

<section>
    <article>


<div class=subscribe>

<form action="" method="post">

<label for="title">Email</label>
<input type="email" name="email" placeholder="email">
<br>

<label for="title">Пароль</label>
<input type="password" name="Пароль" placeholder="пароль">

<br>
<label for="input">Язык</label>
<select size="1" name="lang">
<option selected="selected">Ру</option>
<option>EN</option>
</select>
<br>

<input type="submit" value="Вход в программу">
</form>
</div>

  <img class="imgleft" src="images/638535328.jpg" alt="">

    </article>

</section>

<footer>
<h1>&nbsp;</h1>
</footer>
</body>

<html>

CSS
Код:
/* --------------- reset.css --------------- */
HTML, body, div, span, h1, h2, h3, h4, h5, h6, p, em, img, strong, sub, sup, b, u, i,  dl, dt, dd, ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;                               /* îáíóëßåì îòñòóïû è óáèðàåì áîðäþðû */
vertical-align: baseline;          /* ïðèâîäèì âñå ê îäíîé áàçîâîé ëèíèè */
background: transparent;      /* ÷òîáû íå ïðîñêàêèâàëè ëåâûå ôîíû, óñòàíîâëåííûå ïî óìîë÷àíèþ */
font-size: 100%;                     /* ðàçìåð øðèôòà âñåì îäèíàêîâûé */
}
a {                                           /* ññûëêà íå â îáùåì ñïèñêå ÷òîáû íå ñáðàñûâàòü outline ïî óìîë÷àíèþ */
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
outline:none;
}
table { /* óñòðàíßåì îòñòóïû ìåæäó ß÷åéêàìè òàáëèöû */
border-collapse: collapse;
border-spacing: 0;
}
td, td img {
vertical-align: top; /* âîçâðàùàåì ïðèâû÷íîå âåðòèêàëüíîå âûðàâíèâàíèå */
}
input, select, button, textarea {
margin: 0; /* óáèðàåì îòñòóïû ïî óìîë÷àíèþ äëß ýëåìåíòîâ ôîðì (â ÷àñòíîñòè äëß checkbox è radio) */
font-size: 100%; /* äåëàåì ðàçìåð øðèôòîâ âåçäå îäèíàêîâûì */
outline: none;
}
input[type="text"], input[type="password"], textarea {
padding: 0; /* óáèðàåì âíóòðåííèå îòñòóïû äëß òåêñòîâûõ ïîëåé */
}
input[type="checkbox"] { /* âåðòèêàëüíîå âûðàâíèâàíèå ÷åêáîêñîâ è ðàäèîáàòîíîâ îòíîñèòåëüíî ìåòîê */
vertical-align: bottom;
}
input[type="radio"] {
vertical-align: text-bottom;
}
sub {
vertical-align: sub;
font-size: smaller;
}
sup {
vertical-align: super;
font-size: smaller;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display:block;
}
nav ul {
list-style:none;
}
/* --------------- /reset.css --------------- */

/* --------------- áàçîâûå íàñòðîéêè ---------*/
HTML {
min-height:100%; /* âñåãäà ïîêàçûâàåì âåðòèêàëüíóþ ïîëîñó ïðîêðóòêè  */
}
body {
color: #000;
text-align: left;
font-size: 1em; /* èñïîëüçóåì áåçîïàñíûå øðèôòîâûå CSS ñòåêè */
min-height:100%;
background: #cdebfa;
font-family: 'Roboto', sans-serif;
}
a, a:visited { /* ïîðßäîê ïðàâèë äëß ññûëîê èìååò çíà÷åíèå */
color: #e6618c;
text-decoration: underline;
}
a:hover {
color: #fdf208;
text-decoration:none;
}
a:focus, a:active {
color: #c83867;
text-decoration: underline;
}
h1, h2, h3, h4, h5, h6{
font-weight:normal;
}
img{

max-width:100%;
}
.clr{
clear:both;
}
.clearfix:after {
    clear: both;
    content: "";
    display: table;
}
/* --------------- /áàçîâûå íàñòðîéêè ---------*/

header{
background:url(images/638535326.jpg) center center no-repeat; color:#fff; text-align:center; vertical-align:middle; background-size:cover;
padding:20px 20px 20px 20px;
}

header>h1{
font-size:5.00em; font-family: 'Open Sans', sans-serif; margin-bottom:25px; font-weight:bold; font-style:italic;
}
.subscribe {
background:rgba(9,16,79,1); display:table; height:337; width:328; padding: 40px 20px 40px 20px; margin:5px 0px 5px 0px;
line-height:30px;

}
.subscribe input{
    float:right;
}
.subscribe select{
    float:right;
}
.subscribe label{
    float:left;
}

.subscribe label{
padding: 0px 0px 0px 5px; color: #ffffff; font-size: 0.94em; margin-top: 20px; height: 30px; width: 60px;

}

.subscribe input[type="email"], input[type="password"], select[name="lang"] {
padding: 0px 0px 0px 5px; border: 0; height: 30px; width: 220px; margin-top: 20px; font-size: 0.94em;
color: #515151; box-sizing: border-box;
/* óáèðàåì âíóòðåííèå îòñòóïû äëß òåêñòîâûõ ïîëåé */
}

.subscribe input[type="submit"] {
padding: 0px 0px 0px 5px; background: #ffffff; border:0; color: #515151; font-size: 0.94em;
    cursor: pointer; height: 30px; width: 150px; margin-top: 30px; margin-right: 70px; box-sizing: border-box;
}

article {
width: 1100px;
}

footer{
background:url(images/638535326.jpg) center center no-repeat; color:#fff; text-align:center; vertical-align:middle; background-size:cover;
padding:20px 20px 20px 20px;
}
footer>h1{
font-size:5.00em; font-family: 'Open Sans', sans-serif; margin-bottom:25px; font-weight:bold; font-style:italic;
}

Записан
Ilhom666
Живу я здесь
******

Репутация: +154/-0
Offline Offline

Сообщений: 1333



« Ответ #1 : 28.09.2016, 01:01:10 »

Код
.imgleft {
display: inline-block;
vertical-align: top;
max-width: 60%;  /* или сколько там надо */
}
.subscribe {
display: inline-block;
}
Записан
Ferum1
Осваиваюсь на форуме
***

Репутация: +0/-0
Offline Offline

Сообщений: 49


« Ответ #2 : 28.09.2016, 10:54:37 »

работает, спасибо!
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Powered by SMF 1.1.21 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet