Fordelaktig.no
Webutvikler kurs ASP.NET, C#, CSS mm.

WebRessurs.no - Webprogrammering og ressurs innen ASP, ASP.NET, PHP, SQL, HTML, CSS, Javascript, XML, C#, VB, Flash  mm.

Brukernavn: 
Passord:

Registrèr deg Glemt passord?
Logg deg inn




  ASP.net (199)
  ASP 3.0 (111)
  PHP (30)
  HTML (66)
  SQL (89)
  CSS (46)
  XML (7)
  JavaScript (78)
  Diverse kode (13)


  Programmering (22)
  System og drift (15)
  Trafikk og inntekt (11)
  Guider og tips (22)
  Nyttig lesestoff (23)
  Web forum (603)
  Link galleri (566)


  ASP.NET kurs(5)
  CSS kurs (2)
  JQuery kurs (2)


  Øk trafikken (8)
  Facebook App. (4)
  Microsoft CEO (6)


  Server & web
  Internett & epost
  Systemverktøy
  Sikkerhet
  Fildeling
  Lyd & media
  Diverse software


  Domenesalg
  Metagenerator
  Websikre farger
  Gratis epost
  WebMail


  Bli medlem!
  Siste innlegg
  Gjestebok
  Tips en venn
  Kontakt oss
  Forsiden




Kode Artikler
Linker


Mål internetthastigheten din.


Løsning på høydeproblem i CSS

av Øyvind A. Isaksen
 
I "gamle dager" da det var mest vanlig å benytte tabeller til å lage rammeverket på nettsider var det ingen spesielle utfordringer med tanke på å få kolonner til å følge hverandres høyde. Med CSS og bruken av containere er det mange som sliter med å få en kolonne til å ekspanere / minimere når høyden på kolonnen ved siden av endres. Her viser vi hvordan man ved hjelp av stylesheet kan håndere dette. Om containeren "colA" endres vil "colB" følge etter og visa versa.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Variabel høyde i CSS</title>

<!--STYLESHEET START--------------->
<style type="text/css">
* {
padding: 0;
margin: 0;
}
#colWrapper {
float: left;
width: 800px;
}
#colA {
float: left;
width: 150px;
min-height: 500px;
height: auto !important;
height: 500px;
background-color: #888;
padding-bottom: 10000px;
margin-bottom: -10000px;
}
#colB {
width: 650px;
float: left;
background-color: #999;
padding-bottom: 10000px;
margin-bottom: -10000px;
}
</style>
<!--STYLESHEET STOPP--------------->

</head>
<body>

<div id="colWrapper">
<div id="colA">Meny</div>
<div id="colB">Innhold</div>
</div>

</body>
</html>


Se også:
http://www.ejeliot.com/blog/61
http://matthewjamestaylor.com/blog/perfect-3-column.htm


WebRessurs.no anbefaler:    StackOverflow.com | Experts-Exchange.com | W3schools | ASP.NET | Codeproject | 4Guys
WebRessurs.no er utviklet og drives av SoftMaker LTD
Sett som startside: [ ]. Bokmerk denne siden: [ klikk ]. Sitemap. http://twitter.com/webressurs_no/. Antall brukersesjoner: 9281425.
Copyright WebRessurs.no © 2003 - 2015
Turvenn.no