HTML, CSS - skombinovat <DIV> a <p>

doubleR · Napísal **doubleR**: 28.04.2016 16:58 | HTML, CSS - skombinovat <DIV> a <p>

Caute, mam dva tagy. Jeden je "div" a druhy "p". Problem je ze to vyzera asi takto:

Kód:

<div class="obrazok">  
   <img src="/sites/default/files/default_images/colorful-triangles-background_yB0qTG6.jpg" width="1080" height="1920" alt="background to view" typeof="foaf:Image">
</div>
<p class="textik"">Ahoj fesak.</p>

Mojim cielkom je aby ten text <p> sa zobrazil napriklad v strede obrazku s rozlozenim html tagov tak ako su. Zatial sa mi to nedari, je to vobec mozne s takymto rozlozenim? Tagy menit nemozem..je to Drupal a skusom to zatial takto.

Vdaka.

void · Napísal **void**: 28.04.2016 17:02 | HTML, CSS - skombinovat <DIV> a <p>

Vzhladom na to, ze s nam v podstate nedal skoor nic, tak ti odporucim pozriet si najma css menom display (hlavne absolute/relative) a potom float. Podla mna by si sa k tomu cez to dopracoval.

doubleR

No skusil som stackoverflow a napisali mi funkcne riesenie:

HTML:

Kód:

<div class='someOuterElement'>
  <div class="picture">  
     <img src="http://placehold.it/500/500" width="500" height="500" >
  </div>
  <p class='textik'>Hello handsome.</p>
</div>

CSS:

Kód:

.someOuterElement {
  position: relative;
  width: 500px
}

.textik {
  text-align; center;
  position: absolute;
  top:50%;
  left: 50%;
  transform: translate(-50%, -50%)
}

Nastestie to bolo cele obalene v dive ktory mozem pouzit..robi to troska mess ale da sa to.

HTML, CSS - skombinovat <DIV> a <p>

HTML, CSS - skombinovat <DIV> a <p>

Podobné témy

<a href> around <div>

Hrúbka <frame> a <rules> v <table>

načo slúžia tagy <div id="all"> a <div

formular: presun <option> zo <select> do <select>

>>> Java - connection problem ! <<<

Interpunkcia v elementoch <textarea> a <select>

<tr> riadok tabulky ako odkaz <a>

Nazdielanie netu, LAN<-->PC<--wifi-->Notebook

Chladiče procesorov >>Všetky problémy sem<<

>>>Schvalenie zostavy<<<

tagy <em> a <strong>

<ul> <li> nemam odrazky

<p><hr></p>

<div> height ?

vytvorenie posuvneho <div>

Automatycká velkosť <div>