ugrás a tartalomhoz

CSS - dinamikus DIV

Allspark · 2012. Feb. 8. (Sze), 23.42
Üdvözletem.

Szeretnék csinálni egy dinamikusan méretezhető divet aminek a bal oldalán van egy fix 100px x 100px-as kép, míg a jobb oldalán egy másik div aminek szintén van a jobb oldalán és a balon is szöveg.
Azt szeretném hogy ahogy változik a nagyobb div mérete, a kicsi vele együtt változna de a kép maradjon ugyanazon a méreten a bal oldalon.
Sehogy nem akar összejönni.

Valahogy így kell elképzelni:
-----------------------------------nagy div---------------------------------------------------------------
|.|***************| -----------------------------kis div----------------------------------------..|
|.|***************| |szöveg a bal oldalon...................szöveg a jobb oldalon |..|
|.|****100x100****|.|..........................................................................|..|
|.|******kép******|.|..........................................................................|..|
|.|***************|.|..........................................................................|..|
|.|***************|.|..........................................................................|..|
|.|***************|.|..........................................................................|..|
|.|***************| ----------------------------------------------------------------------------...|
--------------------------------------------------------------------------------------------------------------
<----------------->
Köszönöm a segítséget.
 
1

Meddig jutottál?

Poetro · 2012. Feb. 8. (Sze), 23.53
Meddig jutottál, és hol a probléma?
2

Igen, némi forráskód

Pepita · 2012. Feb. 9. (Cs), 00.02
nem ártana.
A "design-tervet" is könnyebben berajzolhattad volna kódként (colorer).

A rajz alapján a "kis div"-ben is kell lennie két további div-nek.
5

Így tényleg átláthatóbb,

Allspark · 2012. Feb. 9. (Cs), 16.09
Így tényleg átláthatóbb, elnézést:


A képet a Képfeltöltés.hu tárolja. http://www.kepfeltoltes.hu

Vízszintes méretezést nem tudom megoldani.
6

goph-R megoldása válasszal

Poetro · 2012. Feb. 9. (Cs), 16.21
goph-R megoldása válasszal tud szolgálni ezekre a problémákra.
3

Bocs, félreértettem, de itt hagyom, talán mégis segít valamiben

mahoo · 2012. Feb. 9. (Cs), 09.57
Szerk: Hogyan változna a nagy div mérete?


De itt egy példa, talán megfelel:
<div id="nagydiv" style="margin: 0 auto; width: 600px; border: solid 1px red;">
   <img src="*.jpg" style="float: left; width: 200px; height: 200px;">
   <div id="kisdiv" style="float: right; width: 400px; background: blue;">
      <p style="text-align: left; width: 200px; height: 300px; background: brown; float: left;">balra</p>
     <p style="text-align: right; width: 200px; background: green; float: left;">jobbra</p>
   </div>
   <p style="clear: both;"></p>
</div>
4

Jó napom van :)

goph-R · 2012. Feb. 9. (Cs), 10.01

<!DOCTYPE html>
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   <title>Proba</title>
   <style type="text/css">
      .nagy_div {}
      .kep100x100 { width: 100px; height: 100px; float: left; }
      .kis_div { margin: 0 0 0 100px; }
      .szoveg_bal {}
      .szoveg_jobb { float: right; }
   </style>
</head>
<body>
   <div class="nagy_div">
      <img src="kep.png" alt="" class="kep100x100">
      <div class="kis_div">
         <div class="szoveg_jobb">Szöveg jobb oldalon</div>
         <div class="szoveg_bal">Szöveg bal oldalon</div>
      </div>
   </div>
</body>
</html>
A lényeg, hogy a kis_div-nek van egy 100 pixeles margója bal oldalt, a kép pedig balra float-olt.
12

Köszönöm szépen, tökéletesen

Allspark · 2012. Feb. 9. (Cs), 21.50
Köszönöm szépen, tökéletesen működik. :)
7

képek tárolása

Árpesz · 2012. Feb. 9. (Cs), 17.04
Sziasztok!
Csináltattam egy webáruházat, sajnos a programozót
nem tudom utolérni (biztos a válság, vagy kifizettem lehet ott a gond:))
csak mindössze abban kérnék segíteni hogy a webáruházhoz tartozó képeket a szerveren tároljam és úgy hivatkozzak rá ( ebben az esetben hogy kell megadni az útvonalat) vagy érdemes máshol tárolni?
Bocs, kezdő vagyok! úgy látom meg kell tanulni ha boldogulni szeretnék:(
8

Ha nagy az oldal

Hidvégi Gábor · 2012. Feb. 9. (Cs), 17.12
Ha nagy az oldal látogatottsága, és ezzel párhuzamosan a szerver terhelése, akkor érdemes a képeket áttenni máshova.
9

Köszi! Még annyit kédeznék

Árpesz · 2012. Feb. 9. (Cs), 17.26
Köszi!
Még annyit kédeznék hogy az adminisztrációs felületen wysiwyg szerkesztőt használok
a szerveren belül szeretnék hivatkozni httpdocs/images/ mappában a képekre akkor mivel
kell hogy kezdődjön az URL hogy adom meg az útvonalat
Köszi
10

Nézd meg magán az oldaladon

Hidvégi Gábor · 2012. Feb. 9. (Cs), 18.04
Nézd meg magán az oldaladon egy kép url-jét, abból ki tudod deríteni. Például: http://domain.hu/images/akarmi.jpg, akkor a szerkesztőben a kép url-je images/masvalami.jpg formájú legyen.

Igazából az url formája sokmindentől függ, lehet, hogy így nem működik, ehhez hozzáértőnek látni kéne, vagy neked érteni kéne hozzá.
11

Nagyon köszönöm! Sikerült

Árpesz · 2012. Feb. 9. (Cs), 19.05
Nagyon köszönöm! Sikerült megoldanom, lett egy kis sikerélményem, rámfért!