html - HTML / CSS problemer. - Udvikleren.dk - Programmering, webdesign og grafik

Tags: css html

Bruger #17554 @ 05.11.13 11:52

Skal have lavet en side som er delt i to, men med en top menu, samt logo.

Men jeg kan ikke lige se mig ud af det. hvordan jeg får siden delt i 2 lige dele.

Billed: Link

6 svar postet i denne tråd vises herunder
0 indlæg har modtaget i alt 0 karma

Sorter efter stemmer Sorter efter dato

Bruger #3427 @ 05.11.13 12:14

1.520

du skal kigge på float: http://css-tricks.com/all-about-floats/

noget ala det her.

HTML kode

 <div id="con" style="width: 800px;">
   <div id="top">
     Top
   </div>
   <div id="bund">
     <div style="width: 48%; float: left;">A</div>
     <div style="width: 48%; float: left;">B</div>
     <div style="clear: both;"></div>
   </div>
 </div>

Indlæg senest redigeret d. 05.11.2013 12:14 af Bruger #3427

Bruger #17554 @ 05.11.13 12:36

Tak,

Men det som om det ikke vil godkendes når jeg vil have lavet det i 100% i width.

Bruger #7056 @ 05.11.13 14:45

Prøv med:

CSS kode

 .clear{
     clear: both;
     
 }
 .left{
     width: 50%;
     background-color: green;
     float: left;
 }
 .right{
     width: 50%;
     background-color: blue;
     float: right;
     
     
 }

HTML kode

 <div class="clear">
     <div class="left">Hey</div>
     <div class="right">dig<br />Med<br />dig</div>
 </div>

Bruger #17719 @ 06.11.13 15:25

-23

HTML kode

 <div class="siteWrapper">
 
 <div clas="logo">
 <p>logo her</p>
 </div>
 
 <div class="header">
 <p>header her</p>
 </div>
 
 <div class="left">
 <p>Venstre div her</p>
 </div>
 
 <div class="right">
 <p>højre div her</p>
 </div>
 
 </div>

CSS kode

 div {
 margin: 10px;
 padding: 0px;
 }
 
 .siteWrapper {
 height: auto;
 width: 100%;
 }
 
 .logo {
 width: 100%;
 height: 100%;
 }
 
 .header {
 width: 100%;
 height: 100%;
 }
 
 .left {
 width: 50%;
 float: left;
 height: auto;
 }
 
 .right {
 width: 50%;
 height: auto;
 margin: auto auto;
 }

Samlet direkte i HTML dokumentet.

HTML kode

 <html>
 
 <head>
 <style tyoe="text/css">
 div {
 margin: 10px;
 padding: 0px;
 }
 
 .siteWrapper {
 height: auto;
 width: 100%;
 }
 
 .logo {
 width: 100%;
 height: 100%;
 }
 
 .header {
 width: 100%;
 height: 100%;
 }
 
 .left {
 width: 50%;
 float: left;
 height: auto;
 }
 
 .right {
 width: 50%;
 height: auto;
 margin: auto auto;
 }
 </style>
 </head>
 
 <body>
 <div class="siteWrapper">
 
 <div clas="logo">
 <p>logo her</p>
 </div>
 
 <div class="header">
 <p>header her</p>
 </div>
 
 <div class="left">
 <p>Venstre div her</p>
 </div>
 
 <div class="right">
 <p>højre div her</p>
 </div>
 
 </div>
 </body>
 
 </html>

Indlæg senest redigeret d. 06.11.2013 15:32 af Bruger #17719

Bruger #17554 @ 08.11.13 10:36

left and right vises ikke. hvorfor?

Bruger #17081 @ 08.11.13 12:46

1.258

left and right vises ikke. hvorfor?

Prøv evt. @Morten Lybecker's kode. @cristians ser ikke ud til, at fungere.

Hvis left / right ikke vises, så kan det også være, at du ikke har puttet noget indhold ind i dem, så er det klart de ikke vil kunne ses

HTML / CSS problemer.

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler