[ Príspevkov: 4 ] 
AutorSpráva
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 03.02.07
Prihlásený: 25.04.18
Príspevky: 478
Témy: 105 | 105
Bydlisko: Košice/Rožň...
NapísalOffline : 17.07.2008 20:34 | Problém s CSS (roztahovanie contentu)

Mám jeden problém, už si s tým neviem rady, tak to napíšem sem, snáď mi pomôžete. Spravil som si jednu stranku, spodná časť kde je problém (vyznačené červeným) vyzerá takto:

Problém s CSS (roztahovanie contentu)


A problém je nasledovný:
Keď napíšem niečo dlhšie do pravej časti (v CSS ako right) tak sa mi to roztiahne na výšku smerom dole ako vidíte na obrázku, spolu s footerom. Lenže neviem prečo sa mi spolu s tou pravou časťou neroztiahne aj content a pritom prava časť "right" je v contente, tak teoreticky by sa to malo rozťahovať spolu, ale nie. Vidíte tam takú sivú voľnú časť, keďže sa neroztiahne ten content.
Fakt už neviem čo s tým, možno je to len banalita, ale nejak ma nenapadá kde je problém.

Tu je ešte

articles.php (stránka na obrázku) :

Kód:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name='content-language' content='sk' />
<meta name='author' content='M4rek' />
<meta name='keywords' content="M4rek, M4rek22, M4rek's web, M4rek's portal, M4rek's weblog, xp, youtube, ako stahovat videa z youtube, galeria, navody, opensuse 10.3, ad2622, usb modem ad2622" />
<meta name='description' content="M4rek's portal" />
<meta name='robots' content='follow, all' />
<link href="style.css" rel="stylesheet" type="text/css" />
<title>M4rek`s test page</title>
</head>
<body>

<div id="box">

  <div id="header">
   
    <div id="menu">
     
       <a href="index.php">Home</a>
       <a href="aboutme.php">O mne</a>
       <a href="articles.php">Články</a>
       <a href="gallery.php">Galéria</a>
       <a href="contact.php">Kontakt</a>
       
    </div>
   
         
  </div>

     <div id="between">
     </div>


      <div id="content">
         
         <div id="left">
         
          <h2>Novinky</h2>
          <b>16.7.2008</b> - spustená stránka s novým designom
         
          <h2>Odkazy</h2>
          <a href="http://www.panther.php5.sk" onclick="return !window.open(this.href);">PANTHER`s Web</a><br />
          <a href="http://math3z.php5.sk" onclick="return !window.open(this.href);">maTh3z's Techlog</a>
         
          <p>XHTML validné a CSS validné stránky.</p>
         
         </div>
         
         <div id="right">
         <h1>Články</h1>
         
          <a href="jaalinux.php"><h2>Ja a Linux</h2></a>
               <p>Prvýkrát som sa dostal k Linuxu niekedy minulý rok (2007), keď mi jeden kamarát poslal odkaz na jednu z distribúcií, myslím že to bolo Ubuntu. Stránku som si prezrel, pozrel som si nejaké screeny a dosť ma to zaujalo. A tak ma napadlo, prečo nevyskúšať niečo iné ako Windows ? Za vyskúšanie nič nedám. Stiahol som si teda live cd,...</p><br />
 
          <a href="adsl-modem-navod.php"><h2>AD2622 USB modem v openSUSE 10.3</h2></a>
             <p>Vlastníte USB modem AD2622 od Microcomu-u a máte s ním problémy pod linuxovou distribúciou <a href="http://www.opensuse.org" onclick="return !window.open(this.href);">openSUSE 10.3</a>? Ja som mal tiež tento problém, dlho som skúšal rôzne návody ako ho nakonfigurovať, pomaly som už strácal trpezlivosť, až som sa nakoniec dostal k návodu pre openSUSE 10, ktorý mi pomohol, preto som sa rozhodol napísať vám návod ako "rozbeháte" tento modem v openSUSE 10.3.</p><br />
                     
          <a href="youtube.php"><h2>Ako sťahovať videá z YouTube.com ?</h2></a>
             <p>Zvyknete si prezerať videá na <a href="http://www.youtube.com" onclick="return !window.open(this.href);">www.youtube.com</a> a chceli by ste si niektoré videá posťahovať do počítača ? Je to úplne jednoduché: ... </p><br />
         
          <a href="prispusteni.php"><h2>Programy pri spustení</h2></a>
             <p>Spúšťa sa vám veľa zbytočných programov pri štarte OS (Windows XP)? Chcete aspoň o niečo zrýchliť spúštanie vášho "XP-čka"? Tak tento návod je práve pre Vás:...</p>
           
          <div class='podtext'>Kliknutím na nadpis článku sa vám zobrazí celý článok.</div>
         
         </div>
                 
      </div>
       
      <div id="footer">
      <p>M4rek © 2008. Všetky práva vyhradené. Stránky sú optimalizované pre prehliadače Opera, Firefox a IE 7.</p>
      </div>
 
</div>

</body>
</html>



CSS :

Kód:
body {
  background: #272627 url('images/bg.jpg') repeat-x;
   margin: 0;
   padding: 0;
   font-size: 14px;
  font-family: Arial, sans-serif;
  font-weight: normal;
  text-align: justify;
   color: #fff;
}

h1 {
  font: 2em Arial;
  color: #902690;
  padding: 0 0 10px 0;
  margin: 0;
}

h2 {
  font: 1.5em Arial;
  color: #902690;
  padding: 12px 0 5px 0;
  margin: 0;
}

a {
  color: #cb33cb;
  padding: 0 0 0 0;
  margin: 0;
  text-decoration: none;
}

#box {
   width: 800px;
   min-height: 850px;
   margin: 20px auto;
   background-color: #121112;
   border: 0px solid #fff;
}

#header {
  background: #121112 url('images/header.jpg') no-repeat;
  width: 790px;
   height: 120px;
   color: #000;
   padding: 0 0 0 0;
   margin: 10px 10px 10px 10px;
}

#menu {
  color: #fff;
   padding: 0 0 0 0;
   margin: 0 0 0 0;
   float: right;
   border: 0px solid black;
   position: relative;
   left: -50px;
   top: 88px;
}

#menu a {
  background: #121112 url('images/a.jpg') no-repeat;
   color: #e8e3e8;
   float: left;
   font: 1.1em sans-serif;
   line-height: 20px;
   padding: 3px 0 0 0;
   margin: 0 0 0 0;
   text-decoration: none;
   height: 24px;
   width: 79px;
   text-align: center;
}

#menu a:hover {
  color: #ae0eae;
}

#between {
   width: 747px;
   height: 200px;
   background: #121112 url('images/between.jpg') no-repeat;
   color: #000;
   padding: 0 0 0 0;
   margin: 0 0 0 0;
   position: relative;
   top: 10px;
   left: 25px;
}

#content {
   width: 800px;
   min-height: 400px;
   background-color: #121112;
   color: #dddcdd;
   padding: 0 0 0 0;
   margin: 0 0 0 0;
   position: relative;
   left: 0px;
   top: 70px;
}

#left {
   width: 188px;
   min-height: 300px;
   background-color: #121112;
   color: #dddcdd;
   padding: 0 0 0 0;
   margin: 0 0 0 0;
   float: left;
   position: relative;
   top: -5px;
   left: 25px;
}

#left a {
  color: #f0d3f0;
  padding: 0 0 0 0;
  margin: 0;
  text-decoration: none;
}

#left a:hover {
  color: #f0d3f0;
  padding: 0 0 0 0;
  margin: 0;
  text-decoration: underline;
}

#left p {
  color: #dddcdd;
  padding: 20px 0 0 0;
  margin: 0;
 
}

#right {
   width: 522px;
   min-height: 300px;
   background-color: #121112;
   color: #dddcdd;
   padding: 0 0 0 0;
   margin: 0 0 0 0;
   position: relative;
   left: -28px;
   float: right;
   
}

ul#omne {
   list-style-type: square;
   line-height: 19px;
}

p {
   padding: 0 0 10px 0;
   margin: 0 0 0 0;
}

#footer {
  background: #121112 url('images/footer.jpg') no-repeat;
   width: 800px;
   height: 40px;
   background-color: #fff;
   color: #dddcdd;
   padding: 0 0 0 0;
   margin: 0 0 0 0;
   clear: both;
   text-align: center;
   position: relative;
  top: 70px;
}

#footer p {
  padding: 15px 0 0 0;
  color: #c4c4c4;
  font: 0.8em sans-serif;
}



Viem, že Vám to zaberie asi veľa času, kým si to preštudujete, ale budem Vám vďačný ak sa nato pozriete.


Offline

Užívateľ
Užívateľ
Problém s CSS (roztahovanie contentu)

Registrovaný: 03.04.08
Prihlásený: 10.12.19
Príspevky: 4667
Témy: 37 | 37
Bydlisko: Trnava

skus do contentu v css pridat height: auto !important; alebo height:100%;

// nieco k teme http://www.webmasterworld.com/forum83/200.htm


_________________
Hmmm .... Hrošíček ... [Homer]
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 21.02.07
Prihlásený: 21.02.10
Príspevky: 3984
Témy: 96 | 96

pridaj na koniec contentu <div style="clear:both"></div>


Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 03.02.07
Prihlásený: 25.04.18
Príspevky: 478
Témy: 105 | 105
Bydlisko: Košice/Rožň...
Napísal autor témyOffline : 18.07.2008 10:33 | Problém s CSS (roztahovanie contentu)

OK, tak Vám ďakujem za rady, už som to vyriešil, ešte + sa trebalo kus pohrať s tými position: relative a vyriešiť niektoré len cez padding.


 [ Príspevkov: 4 ] 


Problém s CSS (roztahovanie contentu)



Podobné témy

 Témy  Odpovede  Zobrazenia  Posledný príspevok 
V tomto fóre nie sú ďalšie neprečítané témy.

roztahovanie div-ov

v HTML, XHTML, XML, CSS

11

816

07.12.2008 13:51

pire

V tomto fóre nie sú ďalšie neprečítané témy.

problem css

v HTML, XHTML, XML, CSS

6

657

22.04.2008 21:29

kaidžas

V tomto fóre nie sú ďalšie neprečítané témy.

CSS problem

v HTML, XHTML, XML, CSS

4

690

08.10.2009 8:13

mjaus

V tomto fóre nie sú ďalšie neprečítané témy.

CSS problem

v HTML, XHTML, XML, CSS

16

1348

14.01.2007 16:33

exot

V tomto fóre nie sú ďalšie neprečítané témy.

Problem CSS

v HTML, XHTML, XML, CSS

3

704

09.08.2009 21:58

shaggy

V tomto fóre nie sú ďalšie neprečítané témy.

problem s CSS

v HTML, XHTML, XML, CSS

2

424

05.12.2009 15:53

hidden

V tomto fóre nie sú ďalšie neprečítané témy.

html,css problém

v HTML, XHTML, XML, CSS

6

1900

07.03.2019 17:00

weroro

V tomto fóre nie sú ďalšie neprečítané témy.

problem s CSS

v HTML, XHTML, XML, CSS

20

955

22.03.2008 14:31

Svolo

V tomto fóre nie sú ďalšie neprečítané témy.

CSS Template problém

v Webdesign

4

682

20.08.2010 13:03

emer

V tomto fóre nie sú ďalšie neprečítané témy.

Problem odsunutie css

v HTML, XHTML, XML, CSS

8

655

16.09.2009 14:15

arnie16

V tomto fóre nie sú ďalšie neprečítané témy.

WordPress a problem css

v Redakčné systémy

4

356

25.11.2015 20:33

arno

V tomto fóre nie sú ďalšie neprečítané témy.

html,css - opacity problem

v HTML, XHTML, XML, CSS

4

364

30.10.2019 20:53

OnO

V tomto fóre nie sú ďalšie neprečítané témy.

Problém z chybným CSS

v HTML, XHTML, XML, CSS

19

750

06.06.2010 17:44

Lukky

V tomto fóre nie sú ďalšie neprečítané témy.

CSS (problém s nahrávaním)

v Počítačové hry

5

507

02.10.2011 17:27

Jarkou

V tomto fóre nie sú ďalšie neprečítané témy.

Problém s CSS - a

v HTML, XHTML, XML, CSS

6

285

21.03.2013 21:58

17mark

V tomto fóre nie sú ďalšie neprečítané témy.

desing problem s css

v HTML, XHTML, XML, CSS

1

455

30.01.2010 2:19

shaggy



© 2005 - 2024 PCforum, edited by JanoF