Avatar billede jullehansen Nybegynder
18. februar 2006 - 20:48 Der er 10 kommentarer og
1 løsning

Mere rod i div's

Jeg har i et tidligere spørgsmål fået lukket for tidligt inden jeg testede nye ændringer i Explorer.
Da jeg kun bruger Safari (Mac) fik jeg ikke lige chekket på fruens PC. Men det ser ikke så godt ud.
Min højre kolonne er røget helt ud (kun i Explorer!) efter følgende korrespondance: http://www.eksperten.dk/spm/687369

>Notes2c
Hvis du ser dette, har du en ide til hvad der sker i Exploreren?
Avatar billede Slettet bruger
20. februar 2006 - 17:02 #1
Måske giver dette dig et fingerpeg af din side

http://validator.w3.org/check?verbose=1&uri=http://www.hgc.dk/test.php
Avatar billede notes2c Nybegynder
20. februar 2006 - 20:20 #2
Tja... Kan ikke rigtig forklare hvad der sker, man har en workaround har testet dette i ie og ff...

Prøv følgende:

Indfør slyle:
#rightcol {
    right: 7px !important;
    right: 4px;
}

Ret rækkefølgen på leftcol, indhold og rightcol til:
<div id="leftcol">...</div>
<div id="rightcol">...</div>
<div id="indhold">...</div>
Avatar billede jullehansen Nybegynder
21. februar 2006 - 19:40 #3
Jeg forstår ikke helt, skal der indføres 2 right med forskellige værdier? :o.
Avatar billede jullehansen Nybegynder
21. februar 2006 - 19:41 #4
Og hvad med alt det andet der står i #rightcol? :o.
Avatar billede notes2c Nybegynder
21. februar 2006 - 20:47 #5
Ja med hensyn til stylen, for FF vil bruge den overste og ie den nederste.

Og mht rækkefølgen så skal indholdet af dine divs følge med.

Så er den idag:
<div id="leftcol">...</div>
<div id="indhold">...</div>
<div id="rightcol">...</div>

Og ved at flytte rundt på det giver det resultatet du ønsker.... Tror ie har et par problemer...

Men synes tilgengæld du skulle overveje at droppe position: absolute helt og floate i stedet for. For jeg synes det er nemmere at vedligeholde på den måde...
Avatar billede jullehansen Nybegynder
21. februar 2006 - 22:45 #6
OK, hvis jeg forstår dig korrekt, skal jeg tilføje right: 4 + !impotant i right: 7. Droppe alle absolut til fordel for float ( skal det så være float til en bestemt side i alle kolonner?). samt at flytte rundt på div'erne......
Du må undskylde, men jeg er lidt ude at svømme her, det er mere end mit husmands-CSS kan klare!!
Er dog helt enig i at IE har problemer, det er stort set den eneste browser der skal have særbehandling.
Avatar billede jullehansen Nybegynder
21. februar 2006 - 23:12 #7
Nu har jeg flyttet lidt rundt på sagerne. Som du kan se i IE er der stadig lidt ged i den med afstanden til indhold, men ellers ser det meget bedre ud. I Safari ser den helt perfekt ud. Jeg går ud fra den ser ligesådan ud i FF.
Avatar billede notes2c Nybegynder
21. februar 2006 - 23:17 #8
Lægger et eks du kan kigge på....

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

  "http://www.w3.org/TR/html4/loose.dtd">







<html><!-- InstanceBegin template="/Templates/index.dwt" codeOutsideHTMLIsLocked="false" -->

<head>

<!-- InstanceBeginEditable name="doctitle" -->

<title>Hammerum Gjellerup Cykelklub</title>
<base href="http://www.hgc.dk/test.php">

<!-- InstanceEndEditable -->

<meta name="robots" content="none">

<meta name="Author" content="S&oslash;ren Juhl Hansen">

<link rev="made" href="mailto:webmaster@hgc.dk">

<meta http-equiv="Reply-to" content="webmaster@hgc.dk">

<meta name="Copyright" content="S&oslash;ren Juhl Hansen">

<meta http-equiv="Content-language" content="dan">

<meta http-equiv="Content-type" content="text/html; charset=ISO-8859-1">

<meta http-equiv="Content-Style-Type" content="text/css">

<!-- link href="/Styles/standard.css" rel="stylesheet" type="text/css" -->

<style type="text/css" media="print"></style>

<style type="text/css" media="screen">
body {
    background-image: url(../graphics/bagline.gif);
    background-repeat: repeat;
    background-attachment: fixed;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    background-position: left top;
    visibility: visible;
    margin:0px 4px;
    background-color: #FFFFFF;
      }
  #banner h1 {
    border: 1px solid #999999;
    background-image: url(../graphics/banner.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #990000;
    height: 85px;
    margin-bottom: 2px;
  }
  #indhold  {
    margin-left: 153px;
    margin-right: 155px;
    border: 1px solid #999999;
    background-color: #FFFFFF;
  }
  #indhold p, #indhold pre {
    margin: 20px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    line-height: 15px;
    height: auto;

  }
  #leftcol {
    width:150px;
    float:left;
  }
  #leftcol p{
    margin: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    background-image: none;
    background-position: left top;
  }
  .leftbox {
    border: 1px solid #999999;
    background-color: #FFFFFF;
    margin-right: 0px;
    margin-bottom: 5px;
    margin-left: 0px;
  }
  .leftbox p {
    font-size: 10px;
    margin: 10px;
    line-height: 12px;
  }
  #rightcol {
    width: 150px;
    float: right;
    margin-right: 2px !important;
    margin-right: 0;
  }
  #rightcol p {
    margin: 10px 10px 10px 15px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    background-image: none;
    background-position: left top;
  } 
  .rightbox {
    width: 150px;
    background: white;
    border: 1px solid #999999;
    margin-bottom: 5px;
  }
  .rightbox p {
    font-size: 10px;
    margin: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
  }
 
h4 {
    font-size: 12px;
    margin: 0;
    padding: 3px 10px;
    background-color: #990000;
    border-bottom: 1px solid #999999;
    color: #FFFFFF;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
  }
address {
    background: white;
    margin: 5px 155px;
    margin-left: 153px;
    padding: 5px 0 5px 0px;
    font-style: normal;
    font-size: 10px;
    font-weight: bold;
    color: #990000;
    border: 1px solid #999999;
}
address a {
    font-size: 10px;
    color: #990000;
}
.manchet {
    padding: 7px 10px;
    border: 1px solid #990000;
    margin-right: 25%;
    margin-left: 25%;
    color: #990000;
    margin-bottom: 30px;
}
.manchet p{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px !important;
    color: #990000;
    padding: 0px;
}
  a {
    font-weight: normal;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: #000000;
    text-decoration: none;
}
  h1 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #990000;
    padding: 0px;
    border: 0px none #990000;
    font-weight: normal;
    margin: 0px;
}
  h2 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: #666666;
    padding-left: 10px;
    font-style: normal;
    font-weight: normal;
    margin: 5px 0 25px;
}
li {
    margin-right: 20px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    list-style-position: inside;
    list-style-image: none;
    list-style-type: none;
    text-indent: 15px;
    display: list-item;
    white-space: normal;
}
a:hover {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #990000;
}
.pic {
    margin: 10px;
    float: right;
    clear: none;
}
.nyhedheader {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    font-weight: bold;
    color: #333333;
}
.nyhed {
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #990000;
    font-size: 9px;
    line-height: 15px;
    padding-right: 5px;
    padding-left: 5px;
    padding-top: 2px;
}
h3 {
    font-size: 11px;
    color: #990000;
    margin-left: 5px;
    font-weight: normal;
    padding-top: 3px;
}
.dato {
    font-size: 9px;
    color: #999999;
}
#news {
    margin: 20px 3px 3px;
    padding: 3px 2px 2px;
    float: left;
    width: 35%;
    border: 1px solid #990000;
}
#indhold2 {
    float: left;
    width: 63%;
    height: auto;
}
#footer {
    width: 100%;
}
</style>



</head>



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

</div>
<div id="leftcol">
  <div class="leftbox">
    <h4><img src="/graphics/markerw.gif" alt="" align="bottom">Menu</h4>
    <p>
      <a href="/index.php">Forside</a><br> <a href="/bestyrelse.php">Bestyrelsen</a><br>
<a href="/cykeltoj.php">Cykelt&oslash;j</a><br>
<a href="/traening.php">Tr&aelig;ning</a><br>
<a href="/blivmedl.php">Bliv medlem</a><br>
<a href="/kalender.php">Aktivitetskalender</a><br>

<a href="/vedtaegt.php">Vedt&aelig;gter</a><br>
<a href="/arkiv.php">Arkiv</a><br>
<a href="/links.php">Links</a><br>
<br><br>
Siden er opdateret<br>
01.02.06    </p>
  </div>

  <div class="leftbox">
    <h4><img src="/graphics/markerw.gif" alt="" align="bottom">Artikler</h4>
    <p>
      <p><a href="http://www.cybercycling.dk/spinning/artikelvisning.asp?dismode=article&artid=34">Kom
  i gang med spinning</a></p>
<p><a href="http://www.cybercycling.dk/spinning/artikelvisning.asp?dismode=article&foobar=34&artid=32">Basis
  spinner k&oslash;reteknik</a></p>
<p><a href="http://www.cybercycling.dk/spinning/artikelvisning.asp?dismode=article&foobar=34&foobar=32&artid=30">Skavanker
  og ubehag ved spinning</a></p>
<p><a href="http://www.spinning.com">Mere info omkring spinning (engelsk)</a></p>
<p><a href="http://www.cybercycling.dk/cykeltips/artikelvisning.asp?dismode=article&artid=37">Kost
  f&oslash;r, under og efter cykling!</a></p>

<p><a href="http://www.gomotion.dk/artikler.asp?mode=detail&p_id=55&a_id=20&title=art">V&aelig;lg

  den rigtige sportsdrik!</a></p>

<p><a href="http://www.iform.dk/Crosslink.jsp?d=608&a=3884">Giver energibarer<br>
  ekstra energi?</a><br>
  <br>
  <a href="http://www.cykelmotion.dk/gruppe.htm">Info om k&oslash;reteknik</a><br>
</p>

    </p>
  </div>
</div>
<div id="rightcol">
  <div class="rightbox">
    <h4><img src="/graphics/markerw.gif" alt="" align="bottom">Sponsorene</h4>

    <p> <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>

      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <!--<IFRAME> scroller- By Dynamic Drive-->
      <!--For full source code and more DHTML scripts, visit

        http://www.dynamicdrive.com-->
      <!--This credit MUST stay intact for use-->

      <!--iframe class="rulle" id="datamain" src="external.htm" width=125 height=160 marginwidth=5

        marginheight=0 frameborder=0 scrolling=no></iframe -->
    </p>
  </div>
  <div class="rightbox">
    <h4><img src="/graphics/markerw.gif" alt="" align="bottom">Cykel forum</h4>
    <p align="center"><img src="graphics/klinge.jpg" width="71" height="70"><br>
      <a href="/forum/index.php" target="_parent">Start</a></p>
  </div>

  <div class="rightbox">
    <h4><img src="/graphics/markerw.gif" alt="" align="bottom">Besøgende</h4>
    <p>
      Totale hits: 8310<br>Totale brugere: 1788<br>Daglige hits: 26<br>Daglige brugere: 15    </p>
  </div>
  <div class="rightbox">
    <h4><img src="/graphics/markerw.gif" alt="" align="bottom">Vejret</h4>

    <p align="center"><img src="/graphics/dmi.jpg"><br>
      Se vejrudsigten hos</p>
    <p align="center"><a href="http://www.dmi.dk/dmi/index/danmark.htm">DMI</a>
    </p>
  </div>
</div>


<!-- InstanceBeginEditable name="indhold" -->
<div id="indhold">
 
          <h2><img src="/graphics/markerr.gif" alt="" width="16" height="8">Forside</h2>
          <div style="text-align:center; color: #990000; margin-bottom: 30px;"><span style="border:1px solid #990000;padding:10px 15px;font-size:13px;">Sæson 2006</span></div>
 
      <div id="indhold2">
          <p>24. Januar 2006<br>

        <br>
          K&aelig;re medlemmer af HGC.<br>
          <br>
          Allerf&oslash;rst rigtig godt nyt&aring;r til alle medlemmer i klubben.<br>
          <br>
          Vi er nu i gang med den 7. s&aelig;son i klubbens historie. Lad os ikke h&aring;be det
        bliver det sidste &quot;fede&quot; &aring;r og der herefter f&oslash;lger 7 magre &aring;r.<br>

        <br>
          Der er udsolgt hos alle holdene til spinning tirsdag og torsdag i Hammerum
        Hallen. Det er dejligt at vi  atter i &aring;r har v&aelig;ret i stand til at m&oslash;nstre<br>
        s&aring; mange dygtige instrukt&oslash;rer til at forest&aring; vintertr&aelig;ningen. Ogs&aring; dejligt at
          s&aring; mange har tyvstartet p&aring; s&aelig;sonen -det tegner godt til den kommende s&aelig;son.<br>

          Efter sidste s&aelig;sons store succes med klubbens f&oslash;rste tur til Harzen er der
          ogs&aring; arrangeret tur til Harzen i 2006. Det sker fra torsdag den 18. maj til<br>
          og med s&oslash;ndag den 21. maj. Jeg er helt overbevist om, at ogs&aring; turen i &aring;r vil
          blive en succes og en god oplevelse for deltagerne.<br>
          <br>
          Jeg h&aring;ber ogs&aring; at mange af medlemmerne vil p&aring;tage sig jobbet som kaptajn, n&aring;r
        vi starter p&aring; udend&oslash;rss&aelig;sonen omkring 1. april. Jo flere der p&aring;tager sig denne opgave jo mere forst&aring;else bliver der for, hvorfor det er s    &aring; godt med
        holdk&oslash;rsel. Det fremmer ogs&aring; forst&aring;elsen for, hvorfor man m&aring;ske godt kan slutte med et h&oslash;jere eller lavere gennemsnit end det der er aftalt         inden vi k&oslash;rer ud fra parkeringspladsen ved Hammerum Hallen.<br>

          <br>
          Inden vi skal ud og rulle p&aring; landevejene skal vi have overst&aring;et den &aring;rlige
        generalforsamling.<br>
          If&oslash;lge klubbens vedt&aelig;gter &sect; 4, skal generalforsamlingen afholdes i februar
          m&aring;ned. Indkaldelse skal sendes ud til hvert enkelt medlem med 14. dages varsel. Forslag der &oslash;nskes behandlet p&aring; generalforsamlingen skal v&aelig;re                                                 formanden i h&aelig;nde senest 8
          dage f&oslash;r generalforsamlingen.<br>

          Datoen for generalforsamlingen er endnu ikke fastlagt, men den vil blive
          afholdt i overensstemmelse med vedt&aelig;gterne. Har du  et forslag du &oslash;nsker behandlet p&aring; geneneralforsamlingen er du velkommen til at
          skrive til mig.<br>
          <br>
          Herning Cykle Klub har afholdt orienteringesaften for at unders&oslash;ge
        muligheden for at orientere om muligheden for at deltage i l&oslash;b under DCU.<br>
          Den praktiske information vil ogs&aring; v&aelig;re at finde p&aring; hjemmesiden.<br>

          <br>
          Endnu engang velkommen til forh&aring;bentlig rigtig god s&aelig;son i HGC. </p>
          <p>Med venlig hilsen<br>
        Formanden<br>
          Torben Clausen<br>
          </p>

      </div>
  <div id="news">
  <h3>Sidste nyt</h3>
  <div class="nyhed">
    <span class="nyhedheader">Indkaldelse til ordin&aelig;r generalforsamling 2006 </span><br>
          Klubbens bestyrelse indkalder til ordin&aelig;r generalforsamling tirsdag d. 28. februar, kl. 20.15 i Hammerum Hallen.<br>

        Se dagsordenen <a href="general06.php">her</a><br>
      <span class="dato">Oprettet 01.02.06</span>
  </div>
<div class="nyhed">
    <span class="nyhedheader">S&aelig;sonstart p&aring; udend&oslash;rstr&aelig;ning 26. marts 2006 </span><br>

          S&oslash;ndag d. 26. marts kl 10.00 ved Hammerum Hallen starter klubben s&aelig;sonen med et par timer f&aelig;lles k&oslash;retur.<br>
        læs mere <a href="saesonstart.php">her</a><br>
      <span class="dato">Oprettet 01.02.06</span>
  </div>
  <div class="nyhed">

    <span class="nyhedheader">Praktiske informationer fra aftenmødet i Herning Cykle Klub.</span><br>
          Herning Cykle Klubs bredde og elite afdeling har fællestræning 2 gange om ugen. I vintermånederne (ultimo nov. - ultimo marts) starter fællestræningen fra Markedspladsen lørdag
        og søndag kl. 10.00......... læs mere <a href="infoHCK.php">her</a><br>
      <span class="dato">Oprettet 24.01.06</span>
  </div>
  <div class="nyhed">
    <span class="nyhedheader">Klubtur til Harzen 18-21 maj 2006</span><br>

      Vi gentager turen til Harzen. Endnu f&aring; pladser tilbage, s&aring; skynd dig hvis du vil med. Tilmelding og program kan du se <a href="harzen.php">her</a><br>
          <span class="dato">Oprettet 24.01.06</span>
  </div>
  <div class="nyhed">
    <span class="nyhedheader">HEW cykelløbet i Hamborg er en stor oplevelse . . . </span><br>

      Efterhånden er der mange motionsryttere som har prøvet at køre HEW-cykelløbet i Hamborg. For mig var det 1ste og absolut ikke den sidste gang, at jeg deltog i dette ultimative
      arrangement for øvede motionister. Oplevelsen er ubeskrivelig, fordi vi motionister beherskede vejene i og omkring Hamborg på vore væddeløbscykler.... l&aelig;s resten <a href="HEW.php">her</a><br>
    <span class="dato">Oprettet 27.10.05</span>   
          </div>
    <div style="clear: both;"></div>       
      </div>
    <div style="clear: both;"></div>   
</div>
<!-- InstanceEndEditable -->
<div id="footer">
  <div align="center">
    <address>
    Hammerum Gjellerup Cykelklub<br>

    <a href="mailto:postmaster@hgc.dk">hgc@hgc.dk</a>
    </address>
    <font color="#666666" size="1" face="Verdana, Arial, Helvetica, sans-serif">copyright
    &copy; 2006 søren juhl hansen</font></div>
</div>
</body>

<!-- InstanceEnd --></html>
Avatar billede jullehansen Nybegynder
22. februar 2006 - 00:06 #9
Halloo, så ser det bare rigtig godt ud i begge browsere. Godt gået, tusind tak for hjælpen.
:o))
Avatar billede notes2c Nybegynder
22. februar 2006 - 00:16 #10
Vær lige opmærksom på at i mit eks har jeg fjernet nogle styles som ikke blev brugt. Så hvis de bliver brugt andetsteds skal du nok ikke overskrive din css, men blot vælge at lave ændringerne...
Avatar billede jullehansen Nybegynder
22. februar 2006 - 00:32 #11
Ja, jeg så det godt. Det var noget gammelt rod der ikke var blevet fjernet. Dette var så anledningen til at få ren røv at trutte i.
Nok en gang, tak for hjælpen :o)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester