Szerintem igen:

Így vannak

<div id="fejlec">
</div>

<div id="menuk">
<div id="menu1">
</div>

<div id="menuk2">
</div>
</div>

<div id="tartalom">
<div id="szoveg">
</div>

<div id="jobboldaliszoveg"
</div>
</div>

<div id="jobboldaliszoveg" Nincs lezárva, egyébként jónak tűnik. Ha kivetted a tartalomból a margin-left/right-t és még mindig rossz, akkor nincs több ötletem. Én egyszerűen csak szélességet adok meg és egyből középre rendezi.

"hacsak nem jön a jó tündér break utasítás képében..."

Sziasztok!

Van egy oldal, ami jelenleg így néz ki:

Ezt ezzel a kóddal valósítottam meg:

<FRAMESET border=0 cols=180,* frameBorder=NO frameSpacing=0 rows=*>
<FRAME name=menu noResize src="menu.php"></FRAME>
<FRAME name=main src="oldla.php"></FRAME>
</FRAMESET>

Most viszont ezeket szeretném megvalósítani, de akárhogy variálom a kódot, nem megy.

Hogy lehet kivitelezni, köszi!

═════════════════════════════════════════

[link]

"hacsak nem jön a jó tündér break utasítás képében..."

Első:
<FRAMESET border="0" rows="180,*" frameBorder="NO" frameSpacing="0">
<FRAME name="A" noResize src="..."></FRAME>
<FRAMESET border="0" cols="180,*" frameBorder="NO" frameSpacing="0">
<FRAME name="B" noResize src="..."></FRAME>
<FRAME name="C" noResize src="..."></FRAME>
</FRAMESET>
</FRAMESET>

Második:
<FRAMESET border="0" rows="180,*" frameBorder="NO" frameSpacing="0">
<FRAME name="A" noResize src="..."></FRAME>
<FRAMESET border="0" cols="180,*,180" frameBorder="NO" frameSpacing="0">
<FRAME name="B" noResize src="..."></FRAME>
<FRAME name="C" noResize src="..."></FRAME>
<FRAME name="D" noResize src="..."></FRAME>
</FRAMESET>
</FRAMESET>

Harmadik:
<FRAMESET border="0" rows="180,*,180" frameBorder="NO" frameSpacing="0">
<FRAME name="A" noResize src="..."></FRAME>
<FRAMESET border="0" cols="180,*,180" frameBorder="NO" frameSpacing="0">
<FRAME name="B" noResize src="..."></FRAME>
<FRAME name="C" noResize src="..."></FRAME>
<FRAME name="D" noResize src="..."></FRAME>
</FRAMESET>
<FRAME name="E" noResize src="..."></FRAME>
</FRAMESET>

Említettük már, hogy frame-ket használni legalább 2 évtizede elavult technika, és senkinek se ajánljuk?

"Moonshine Whiskey (70°, ízesítés nélküli) van. Fincsi" - Teebee - "De az kiírtaná az egész családomat..Akkor is ha csak én innék belőle.." - forintuser

Köszi!

Akkor újabban mit ajánlanak?

═════════════════════════════════════════

Jelenleg a layout-ot div-ekkel szokás elkészíteni, amelyek a float tulajdonság állítgatásával kerülnek egymás mellé. A neten rengeteg előre elkészített layout sablon van, indulásnak mondjuk a "3 column layout css" egy elég jó keresési kulcsszó.
Régebben ugyanezt táblázattal csinálta mindenki.

[ Szerkesztve ]

Van három div-em egymás alatt:

div1
div2
div3

az egyes és a hármas statikus méretű. a kettesbe töltöm bele a tartalmat. viszont, ha ha ez miatt nem fér ki és elcsúszik a div2 lefelé, nem tolja magával a div3-at. Hogy lehetne ezt megoldani?

SZERK: Alapból "tolnia" kellene a div3-t lefelé. Valószínűleg a div3-t rögzítetted valamilyen stílusdefinícióval.

[ Szerkesztve ]

"hacsak nem jön a jó tündér break utasítás képében..."

Ez a kód:

css file:

#banner {height:250px; width:950}
#tartalom {height:800px; width:950px}
#hirek {width:685px; color:white; margin-top:20px; margin-left:20px; margin-right:20px; float:left}
#kepek {width:205px; margin-left:10px; margin-right:10px; float:left; color:white}
#lablec {margin-bottom:20px; color:white; width:950px}

index.php dives része:

<div id="banner">
</div>

<div id="tartalom">
<div id="hirek" align="left">
</div>
<div id="kepek" align="left">
</div>
</div>

<div id="lablec">
</div>

A hirek div-ből csúszik ki a tartalom. Az nem tolja magával a tartalom div-et, ami így nem tolja a leblec div-et. Ilyenkor mi a teendő?

A clear stílusdefiníció megszünteti a kilebegtetést az adott elemnél. Tehát a #lablec-nél add meg, hogy: clear:both; (mindkét (bal,jobb) kilebegtetést megszünteti).

Szerkesztés: Azonban a tartalom így is ki fog lógni, mivel megadtál egy 800 px magasságot. Ezt azt hiszem már tudod kezelni.

[ Szerkesztve ]

"hacsak nem jön a jó tündér break utasítás képében..."

Köszönöm szépen a segítséget, így már jó.

Srácok!

Azt, hogy tudom megcsinálni, ha a folytonos szövegben szeretnék valamelyik szóra pl. h3-t használni, hogy a szöveg ne "essen szét", vagy ne az egész szöveg legyen h3?

Mert hiába csak pl. a h3-t használni-t jelölőm ki h3-ként a progi az egész szöveget h3-ként jeleníti meg (a kijelölés ellenére), ha meg kézzel írom be a h3-t használni elé meg mögé a <h3>...</h3> -at akkor meg "szétesik" a szöveg......

Műanyag, alumínium és motoros redőnyök, valamint szúnyoghálók készítése, szerelése. www.szaboredony.hu

Ez azért van, mert a h3 (meg a többi heading is) blokkszintű elem. Két megoldás van:
- h3 helyett használj span-t, amire css-ben megadod a megfelelő stílus definíciókat
- h3-ra css-ben állítsd be, hogy display:inline . Ezzel lehet rábírni a böngészőt, hogy sorszintűként jelenítse meg.

Köszönöm a segítséget.

A head részbe beírt
<style type="text/css">
h3 {
display: inline;
}
</style> -el
és a kijelölt szóhoz beírt
<h3 style="font-weight: normal;"> ..........</h3> kóddal megoldódott a problémám.

De lenne egy láma kérdésem.
Ha több különféle css elemet is alkalmazok akkor elég ha a meglévő
<style type="text/css"> ......</style> közé írom az újakat vagy mindegyikre külön kell írni egyet?

[ Szerkesztve ]

Műanyag, alumínium és motoros redőnyök, valamint szúnyoghálók készítése, szerelése. www.szaboredony.hu

elég ha a meglévő
<style type="text/css"> ......</style> közé írom az újakat vagy mindegyikre külön kell írni egyet?
Elég, de javasolt küső file-ból linkelni a css-t.

Már bocsi a tudatlanságomért, de ez a "... javasolt küső file-ból linkelni a css-t" mit is jelent?

Műanyag, alumínium és motoros redőnyök, valamint szúnyoghálók készítése, szerelése. www.szaboredony.hu

Azt jelenti, hogy a css nem a <head> részben van, hanem egy külső file-ban.
<link href="valami.css" type="text/css" rel="stylesheet">
Nézd meg bármelyik általad használt oldal forrását (mondjuk a prohardver jó lesz), mindenhol így oldják meg.

Köszi, megnézem, de mi van akkor ha a <head> részbe van írva (mint ahogy a # 3517-ben megoldásként írtam)?

[ Szerkesztve ]

Műanyag, alumínium és motoros redőnyök, valamint szúnyoghálók készítése, szerelése. www.szaboredony.hu

És mit kell írni a valami helyére? ( )
Elnézést a sok kérdésért de a css-vel eddig még egyáltalán nem foglalkoztam ...

A PH forrásában ez van:
<link href="/css/common_v44.css" type="text/css" rel="stylesheet" />
<link href="/css/special_v27.css" type="text/css" rel="stylesheet" />

[ Szerkesztve ]

Műanyag, alumínium és motoros redőnyök, valamint szúnyoghálók készítése, szerelése. www.szaboredony.hu

A különbség mindössze annyi, hogy amit a <head>-be írtál, az magasabb prioritású, mint amit linkelsz. Ez azt jelenti, hogy ha van két ugyanolyan stílusdefiníció ami a headbe és a linkelt stíluslapban is megvan, akkor a head-ben rögzítettek fognak érvényesülni. Egyébként nincs sok értelme két helyre rögzíteni a meghatározásokat. Érdemes linkelni a css-t.

@3522: A valami helyére a fájlnevet kell írni.

[ Szerkesztve ]

"hacsak nem jön a jó tündér break utasítás képében..."

Jó, hogy a "megjelenésben" megszűnt a hiba, de a W3C hibásnak ítéli, mert nincs kezdő tag-ja.

Műanyag, alumínium és motoros redőnyök, valamint szúnyoghálók készítése, szerelése. www.szaboredony.hu

Valószínűleg <span>-n vagy hasonlón belül használod a <h2>-t, de az is lehet, hogy előtte valahol van lezáratlan tag-ed.
Én a helyedben nem erőltetném inline módban a <h2>-t szövegen belül, az életben nem lesz valid mert ez a tag nem erre való. Szövegrészek formázására ott a <span>, ahogy cucka is említette a #3516-ban.

[ Szerkesztve ]

"Moonshine Whiskey (70°, ízesítés nélküli) van. Fincsi" - Teebee - "De az kiírtaná az egész családomat..Akkor is ha csak én innék belőle.." - forintuser

Próbáltam azt is, de azzal végkép nem sikerült ....

@ Brown ügynök

Köszi az infót

[ Szerkesztve ]

Műanyag, alumínium és motoros redőnyök, valamint szúnyoghálók készítése, szerelése. www.szaboredony.hu

Hogy próbáltad?
Pl. így, az alábbi <span> tag használatával olyasmi lesz, mint egy default <h2>:

<p>blablablabla <span style="font-size: 24px;font-weight: bold;">ide jön az a szöveg, ami eddig h2-n belül volt</span> asdasdasdasd</p>

Sk8erPeter

Sziasztok!

Ezt a problémát miképpen lehet orvosolni?

Magyarán van kettő div egymás mellett. Mindkettő 40 képpont magas. Mindkettőben vannak képek. Az elsőben egy 40 képpont magas, a másodikban kettő kisebb. Firefox alatt minden klappol, ellenben Internet Explorer alatt lejebb csúszik a kép 1 (lehet 2) pixelt. Valakinek ötlet?

Senkinek nincs ötlete?

Lehet, hogy az IE 8 beépített stílusdefiníciója miatt csúszik el. Ha html kóddal ágyaztad me a képet, akkor pozicionáld ezen parancsok valamelyikével, ha css-el raktad be a képet, akkor pedig így valahogy.

Itt pedig megnézheted ( a "hacks" alatt), hogy írd, hogy csak az IE egyes verziójában működjön a stílusdefiníció: [link]

"hacsak nem jön a jó tündér break utasítás képében..."

"csak az IE egyes verziójában működjön a stílusdefiníció"
Hű, van, aki még az IE egyes verziójára is optimalizál?
(Amúgy értem én. )

(#3528) n00n : kód, mintaoldal nélkül nehéz okoskodni, de Brown ügynök jól mondja, hogy lehet, hogy a beépített stílusdefiníciók okozzák az elcsúszást, lehet, hogy ezeket egyszerűen felül kéne bírálni a margin, padding, stb. explicite megadásával. Mivel gondolom senki nem tanulta meg fejből az IE összes hülyeségét, ezért csak empirikus úton lehet sokszor rájönni, hogy mégis mi okozza IE-ben a baromságokat.
Mellesleg le kéne lőni azokat, akik az IE fejlesztésében részt vettek.

Sk8erPeter

na próbálkozok ezekkel a divekkel, de nagy a kuszaság, ezt töltöttem le és gyötröm.

═════════════════════════════════════════

Első ránézésre elég jónak tűnik.

Sk8erPeter

Amit én kínlódok az össze-vissza egymásra csúszkál, lehet elsőre egy fixet kéne csinálnom, aztán majd liquidezek.

Amúgy ezekkel a divekkel lehet olyat, hogy a két szélső fix (mármint tartalomra) és a középsőben váltakozik a tartalom annak függvényében, hogy ekét szélsőbenmire kattitnaanak?

target pl nem működik.

[ Szerkesztve ]

═════════════════════════════════════════

1.) Ja, ne szopasd magad liquid layouttal, elég első körben megtanulni a fix struktúrát.

2.) Lehet, persze, AJAX-szal. De ne ezzel kezdd, mert a Google számára is szerethetővé kellene tenned az AJAX-os kérésekkel tele lévő oldaladat, ami nagyon nem egy egyszerű meló.
Működjön úgy, hogy az oldal újratöltődik. Majd ha penge leszel, akkor szétAJAX-ozhatod az agyadat.
A target nem erre való, azzal azt adod meg, hol nyíljon meg a tartalom (pl. új fülön). Ezt XHTML Strict már nem támogatja.

Sk8erPeter

Akkor azt javaslod, hogy írjam meg a 4 oldalt más címmel és tartalommal és azokat lapozgassa 1:1-be, amikor rákattan egy menüre?

Ja, fixre ezt találtam.

Nagyon rossz, mert úgy kell rájönnöm, melyik kód minek színét változtatja, hogy átírkálom, majd ráfrissítek (lehet előbb olvasni kéne a témáról)

És az mennyire necces, hogy a két szélső oszlop fix marad a középső meg 700-ig szűkülhet, de utána már nem?

[ Szerkesztve ]

═════════════════════════════════════════

"Akkor azt javaslod, hogy írjam meg a 4 oldalt más címmel és tartalommal és azokat lapozgassa 1:1-be, amikor rákattan egy menüre?"
Én ilyet tuti nem javasolnék , mert PHP-vel include-olnám a mindig ismétlődő elemeket, és csak a változóakat cserélném. De ha nem vágod a PHP-t, akkor kezdetnek jó lesz.

Jó ez a fix cuccos is.
Nem kell frissítgetned állandóan, ha használod a böngészőbe beépülő web developer tools cuccokat, pl. Chrome-nál, Firebugnál, Opera Dragonfly-nál az adott HTML-elemre jobb klikk, majd Inspect Element (Elem kivizsgálása/vizsgálata).
Itt általában van egy element.style rész, és az id, class, egyéb szerinti stílusdefiníció (pl. #content), ezenbelül egyből tudod változtatni a színeket és minden egyéb stílusra vonatkozó dolgot, rögtön látszik a változtatás. Ha webfejlesztéssel akarsz foglalkozni, ezt az elsők között kell megtanulni szerintem, mert nagyon sok hasznát veheted még.

[ Szerkesztve ]

Sk8erPeter

Eléggé kínai, volt amit írtál, de nem a te hibád. Utánajárok ezeknek...

a teszt html-emet átneveztem teszt php-ra (mert annak kell lennie) És az ékezetes betűk helyett más ír ez mirefel van?

[ Szerkesztve ]

═════════════════════════════════════════

Gondolom nem jó a karakterkódolás. Notepad++-szal nézd meg, mire van állítva.
Encoding (Kódolás) menüpontban meg a Convert to... (Átalakítás...) menüpontokkal tudod átállítani.

Sk8erPeter

Igen, eljátszadoztam a kódolásokkal, és összejött. alakul.

Most épp azután kutakodok, hogy rejthetem el az email címem a robotok elől...

Csak ehhez meg már java script kell vagy mi...

═════════════════════════════════════════

Próbáld ezt: reCAPTCHA Mailhide (Google-től)

Sk8erPeter

Köszi, de amit belinkeltem úgy fest bevált, mert a java script nélkül nem írja ki a címet.

Egyébként erre jutottam. Téged, mint a témában jártasabb ügyfél kérdezlek, mi a véleményed róla?

Tudom, te egy óra alatt összeraktad volna, nekem egy fél éjszakámba és fél napomba került.

═════════════════════════════════════════

sziasztok!

Nemrég felkértek ,hogy csináljak egy ismerősömnek egy oldalt.
Suliból van tapasztalatom a HTML-ből.
Viszont egy résznél megakadtam , ezért kérném a segítségeteket.

Egy öt hivatkozásból álló "menü részt" akarok létrehozni az oldal aljára és ezt táblázattal akartam megoldani. Ezt a táblázatot az oldal aljára, középre akarom helyezni. Így oldottam meg :

<style type="text/css">
body {
background-image:url('tabla222.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}
#menu1 {
position:fixed;
text-align:center;
bottom:0;
left:20%;
}
</style>
És a táblázatot <div> tag-ek közé tettem.

Ez így jó is lenne Firefox, Chrome böngészőben ,viszont az Internet Explorer sehogy sem akarja elfogadni , a táblázatom az oldal tetején , középen van.
Mivel ez egy főoldal/nyitóoldal lenne a háttéren kívül csak ez a táblázat szerepelne rajta.

Bármilyen megoldást , véleményt szívesen fogadok.
Előre is köszi!

Ezt a fix pozicionálást (position:fixed) egy menünél felejtsd el. Felbontástól, böngészőablak-mérettől függően el fog tolódni, másképp lesznek egymáshoz képest az elemek, stb., az meg nem fasza. (Próbák)
Egyébként margin:0px auto; is hasznos.

[ Szerkesztve ]

Sk8erPeter

Utólag láttam, hogy írod, hogy "csak ez a táblázat szerepelne rajta." Így nem biztos, hogy problémát fog okozni a fixed position, csak pont IE-nél: [link]. Ritkán, nagyon indokolt esetben érdemes csak használni a fixed positiont.

Nem ártana látni a többi kódot is, hogy tudjuk, hogyan oldottad meg konkrétan.

[ Szerkesztve ]

Sk8erPeter

Nézd meg, hogy rendesen megadtad-e a doctype-ot.

"hacsak nem jön a jó tündér break utasítás képében..."

DOCTYPE nincs megadva, hogy őszinte legyek sose használtam még.

így néz ki :

<HTML>

<HEAD>

<TITLE>WEBLAP</TITLE>

<style type="text/css">

body {

background-image:url('tabla222.jpg');

background-repeat:no-repeat;

background-attachment:fixed;

background-position:center;

}

#menu1 {

position:fixed;

text-align:center;

bottom:0;

left:20%;

}

</style>

</HEAD>

<Body bgcolor="#f5f0d3" link="black" alink="black" vlink="black">

<div id="menu1">

<table border="0" align="center" width="50%" cellspacing="50">

<tr>

<td><font size="5"><b><a href="a.html">A</a></b></font>

<td><font size="5"><b><a href="b.html">B</a></b></font>

<td><font size="5"><b><a href="c.html">C</a></b></font>

<td><font size="5"><b><a href="d.html">D</a></b></font>

<td><font size="5"><b><a href="e.html">E</a></b></font>

</tr>

</table>

</div>

</body>

</HTML>

[ Szerkesztve ]