How to position an element next to another element of an undefined position?

I am very new to html / xml / css and I try to teach myself. However, I ran into a problem that Google search could not solve.

I would like to place a small image in a fixed location relative to another element (?)

I believe this is the code of the element that I want to position the second element relatively.

<style type="text/css">
 #wrap { 
    width:550px; 
    background-color:#fff; 
    margin:0 auto; 
    padding:0; 
    border-right:1px solid #ccc;         
    border-left:1px solid #ccc; 
}

 #container {
     width: 500px;
      margin:0 auto;
     padding: 25px;
      font-size:.85em;
     background-color: #fff;
 }

and this is the partial code I'm trying to edit for the .xyz position to the right of "#wrap"

.xyz {
    position: ???;
    top: 200px;
    right: ???;
    _position: ???;
    _margin: ???;
    _text-align: right;
    z-index: 1337;
}

my SOF search made me believe that I should do something according to this - Place the HTML element relative to its container using CSS . - but I couldn’t.

I really appreciate any help you can offer. I hope I correctly explained my problem.

+3
2

.xyz #wrap, float:right; .xyz, , .

EDIT: - :

<div class="wrap">
     <div class="shuffle"><my shuffle img></div>
     ......Other stuff......
</div>

css wise:

.wrap{position:relative;overflow:visible;}
.shuffle{position:absolute;right:100px;}
0

, , , , , , . ( - ) :

.container  {
  float: left;
  width: 800px;
 }

#wrap { 
  float: left;
  width:550px; 
  background-color:#fff; 
  margin:0 auto; 
  padding:0; 
  border-right:1px solid #ccc;         
  border-left:1px solid #ccc; 
}

#container {
      width: 500px;
      margin:0 auto;
      padding: 25px;
      font-size:.85em;
      background-color: #fff;
}
.xyz {
    float: left;
    margin: 0 0 0 20px;
    width: 200px;
}

.wrap div .xyz , 20px , .container.

, #container, , .xyz .wrap.

#container , :

.container  {
    float: left;
    overflow: auto;
    width: 1330px;
}

 #container {
      float: left;
      width: 500px;
      margin:0 0 0 20px;
      padding: 25px;
      font-size:.85em;
      background-color: #fff;
 }

.xyz {
    float: left;
    margin: 0 0 0 20px;
    width: 200px;
}

xyz 20px, , , , div.

, WordPress ( Genesis), 2007 .

0

Source: https://habr.com/ru/post/1747640/


All Articles