<b>REGISTER</b>

GFX-Sector - HTML, CSS


 
GFX-Sector » Coding Area » Webentwicklung » HTML, CSS » Problem mit coding » Hello Guest [Login|Register]
Last Post | First Unread Post Print Page | Recommend to a Friend | Add Thread to Favorites

HTML, CSS

Einfache Scriptsprachen und deren Layout mit HTML und CSS
Post New Thread Post Reply

Problem mit coding

     Deutsche Version  English version
Author
Post « Previous Thread | Next Thread »

firefighter
Fingerwischer


Avatar von firefighter

Registration Date: 20.01.2009
Posts: 34
Program: Photoshop CS4 Extendend

Spacer
Problem mit coding

Problem mit coding

      

Hallo liebes Board.
ich versuche mich gerade an einer Homepage, wo ich jedoch einfach nicht weiter komme.
vielleicht könnt ihr mir helfen.
Ich habe den Header schon hinbekommen, aber mit der Navigation und dem Textbereich wird das einfach nichts. Die Navigation geht nicht bis zum unteren seiten rand.



es sieht jedoch folgendermaßen aus:



mein Quelltext sieht wie volgendermaßen aus:

HTML:

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:

<!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>
<link rel="stylesheet" media="screen" type="text/css" title="Style" href="css/style.css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Home</title>
</head>
<body>
<div id="content">
<div id="header">
<div id="banner">

</div>
<div id="platzfueller">
</div>
<div id="logo">

</div>
</div>
<div id="nav">
Hi
</div>
<div id="text">

</div>


</div>
</body>

</html>





CSS:
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:

@import url('css-reset.css');
@import url('typography.css');


body {
	        background-color: #d4d4d4;
			margin: 0;
			padding: 0;
			height: 100%;
	} 
#content{
	width:1600px;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	height: 100%;
}

div#header {
	        background-color: #404040;
	        height: 305px;
	        width: 1600px;


	}



div#banner{
			background: url(img/banner.png);
			height: 305px;
			width: 1160px;
			float: right;
	}

div#platzfueller{
	height: 80px;
	width: 260px;
	margin-left: 70px;
}
	
div#logo{
			background: url(img/logo.png) no-repeat;
			height: 150px;
			width: 260px;
			margin-left: 70px;
			position: relative;
	} 
div#nav{
			width: 265px;
			min-height: 100%; /* Mindesthöhe für moderne Browser */
			background-color: #ff5a00;
							
	}
div#text{
	width: 1335px;
	}



€: hatte mich mit Hide und spoiler vertan Wink

Die Navigation ist ja nicht das Thema, aber ich will, das die Navigation komplett an der seite ist, also über die ganze Seite hinweg Wink nach ganz unten scrollen und immernoch Orange ... wenn ihr versteht, was ich meine.

Ich hoffe mir kann einer helfen ..

BTW. würde ich mich über ein kommentar zum Design sehr freuen


EDIT:
kann nix neues schreiben, daher Edit Wink
ja, ich will aber, dass der Balken der Navigation mindestens die Browser höhe hat.
Wenn weniger Text ist trotzdem die Browser höhe.
Sobald jedoch mehr Text als die Browser höhe ist, soll das ganze Wachsen Wink









Erste sig Zunge raus

This post has been edited 4 time(s), it was last edited by firefighter: 18.10.2010 15:55.

Problem mit coding 17.10.2010 18:52 firefighter is offline Search for Posts by firefighter

Fireball Fireball is a male
Boardchef


Avatar von Fireball

Registration Date: 11.11.2006
Posts: 16,355
Classing-Rank: GFX-Sector
Location: Bremen, Deutschland
Program: Adobe Photoshop CS2
Deviantart: oenismaster
Forums: (alle)

Spacer
      

Häng mal das Coding ran Wink



Problem mit coding 17.10.2010 18:54 Fireball is offline Homepage of Fireball Search for Posts by Fireball

ClOuDy. ClOuDy. is a male
Pfadfinder


Avatar von ClOuDy.

Registration Date: 31.01.2010
Posts: 569
Program: PS CS5

Spacer
      

quote:
Um den versteckten Text sehen zu können, bedanke dich bitte bei diesem Thema, indem du den Link "für diesen Thread beim Autor bedanken" unter dem ersten Beitrag dieses Themas klickst. "Danke"-Postings sind nicht gestattet und können zu einer Verwarnung führen!


ähm...bedanken is überflüssig. außerdem gibts keinen "danke" text Wink

pack das in eine code-box. das hilft - ansonsten kann dir keiner helfen.

€: nach dem posts gings...

min-height: 100%; /* Mindesthöhe für moderne Browser */
das is quatsch

gib #text und #nav mal ne höhenangabe. so wie es jetzt ist kann da nix angezeigt werden.

prozentangaben müssen sich auf etwas beziehen - was hier nich geschieht. momentan denk sich der browser:

ok - 100% höhe von 100% - ähm...das ist 0... ok!
kein mensch brauch tatsächliche 100% und es macht auch keiner. die höhe der bereiche, die leer sind brauchen eine höhenangabe. bereiche in den etwas ist - z.b. text, eine navi usw. werden dadurch in der höhe geregelt.

außerdem rate ich dir von der 1600px breite ab, bei einem großteil der internet benutzer sieht man das layout nur zu 60% und man muss zur seite "scrollen". das ist einfach nur nervig.



This post has been edited 1 time(s), it was last edited by ClOuDy.: 18.10.2010 06:01.

Problem mit coding 18.10.2010 05:52 ClOuDy. is offline Search for Posts by ClOuDy.

ily.94 ily.94 is a male
Zauberstabbenutzer


ily.94 hat kein Avatar

Registration Date: 22.08.2010
Posts: 21
Location: Ruhrgebiet
Program: Adobe Photoshop

Spacer
      

Wenn du noch Hilfe benötigst melde dich mal nach 17 Uhr bei mir wenn du Lust hast und hilfe noch nötig ist..

This post has been edited 1 time(s), it was last edited by ily.94: 18.10.2010 10:08.

Problem mit coding 18.10.2010 10:01 ily.94 is offline Search for Posts by ily.94

ClOuDy. ClOuDy. is a male
Pfadfinder


Avatar von ClOuDy.

Registration Date: 31.01.2010
Posts: 569
Program: PS CS5

Spacer
      

quote:
ja, ich will aber, dass der Balken der Navigation mindestens die Browser höhe hat.


so ein quatsch...die höhe variiert zwischen 800 und 1600px...ohne script nicht machbar. und mit script ziemlicher schwachsinn.

aber als anhaltspunkt > per js auflösung des besuchers auslesen und die höhe dementsprechend anpassen. mit leihenhaftem wissen nicht machbar, aber viel spaß beim googlen.



Problem mit coding 18.10.2010 17:22 ClOuDy. is offline Search for Posts by ClOuDy.

firefighter
Fingerwischer


Avatar von firefighter

Registration Date: 20.01.2009
Posts: 34
Program: Photoshop CS4 Extendend

Thread Starter Thread Started by firefighter
Spacer
      

wenn du so genau weißt, wie man das macht, dann kannst du mir doch bestimmt einen Tipp geben, oder?










Erste sig Zunge raus

Problem mit coding 18.10.2010 23:03 firefighter is offline Search for Posts by firefighter

ClOuDy. ClOuDy. is a male
Pfadfinder


Avatar von ClOuDy.

Registration Date: 31.01.2010
Posts: 569
Program: PS CS5

Spacer
      

kann ich, da ich das aber unsinnig finde lasse ich das.



Problem mit coding 19.10.2010 10:14 ClOuDy. is offline Search for Posts by ClOuDy.

Lennart-Blom Lennart-Blom is a male
Scharfzeichner


Lennart-Blom hat kein Avatar

Registration Date: 18.10.2010
Posts: 107
Location: NRW
Program: Adobe Photoshop CS5

Spacer
      

Wie ich das immer bei Websites mache....

Einen Div als Wrapper, der 960 breit ist und eine bestimmte Höhe hat.
Bei relativen Angaben hat man doch eh immer Probleme beim Skalieren des Browserfensters...

Also das ist so meine Meinung dazu.
Und ne absolute Breite von 1600px macht wirklich keinen Sinn verwirrt

Gruß

Problem mit coding 19.10.2010 10:52 Lennart-Blom is offline Homepage of Lennart-Blom Search for Posts by Lennart-Blom

bpr bpr is a male
Spender


Avatar von bpr

Registration Date: 18.11.2007
Posts: 557
Location: London
Program: Zend Studio
Forums: Coding; International Section

Spacer
      

http://css-tricks.com/fluid-width-equal-height-columns/ sollte dein Problem wohl loesen




Freude
Problem mit coding 19.10.2010 13:01 bpr is offline Homepage of bpr Search for Posts by bpr

ClOuDy. ClOuDy. is a male
Pfadfinder


Avatar von ClOuDy.

Registration Date: 31.01.2010
Posts: 569
Program: PS CS5

Spacer
      

er will, dass sich ein element der browserhöhe anpasst. das hilft ihm da nicht weiter^^



Problem mit coding 19.10.2010 14:41 ClOuDy. is offline Search for Posts by ClOuDy.

bpr bpr is a male
Spender


Avatar von bpr

Registration Date: 18.11.2007
Posts: 557
Location: London
Program: Zend Studio
Forums: Coding; International Section

Spacer
      

achso ...

wie waere es denn mit

code:
1:
2:
3:
4:
5:
6:
7:
8:
<div id="cnt">
<div id="left">
</div>
<div id="right">
</div>
</div>


cnt:
background color orange

left:
nur width

right:
background-color weiss


left ist halt seine komische sidebar

und right ist der content,
damit ist die sidebar optisch gesehen immer so hoch wie der content, da der content ja mehr inhalt von der hoehe als die sidebar haben sollte, und damit sollte das problem ja optisch gesehen geloest sein. ist zwar von den hoehen nicht wirklich geloest, da der linke div keine hoehe hat, aber durch den algemeinen hintergrund, von cnt sieht es ja so aus, also waere es geloest. sollte aber bei speziellen sachen doch probleme aufgeben.

und dann kann man ja einfach mit diesem 100% height zeug arbeiten muss er halt nur zusehen, dass er das "ordentlich" verschachtelt mit kack markup und dann ist das doch geloest.

hf




Freude
Problem mit coding 19.10.2010 15:57 bpr is offline Homepage of bpr Search for Posts by bpr

ClOuDy. ClOuDy. is a male
Pfadfinder


Avatar von ClOuDy.

Registration Date: 31.01.2010
Posts: 569
Program: PS CS5

Spacer
      

ich denke das wird ihm nicht genügen - bzw sein wissen überfordern.

die 100% werden sein problem, sollte ich ihn richtig verstanden haben, theoretisch auch nicht lösen. da selbst die 100% ja vorher einen höhenwert brauchen. das bedeutet er es auf einer auflösung richtig machen kann, wobei die anderen dann wieder nicht gehen...naja..theorie und so



Problem mit coding 19.10.2010 21:45 ClOuDy. is offline Search for Posts by ClOuDy.

firefighter
Fingerwischer


Avatar von firefighter

Registration Date: 20.01.2009
Posts: 34
Program: Photoshop CS4 Extendend

Thread Starter Thread Started by firefighter
Spacer
      

habs jetzt (zwar unprofessionell aber es klappt) gelöst ... danke für Tipps Wink










Erste sig Zunge raus

Problem mit coding 19.10.2010 22:31 firefighter is offline Search for Posts by firefighter

bpr bpr is a male
Spender


Avatar von bpr

Registration Date: 18.11.2007
Posts: 557
Location: London
Program: Zend Studio
Forums: Coding; International Section

Spacer
      

schreib doch bitte nochmal die loesung hier rein :>




Freude
Problem mit coding 20.10.2010 03:18 bpr is offline Homepage of bpr Search for Posts by bpr

ClOuDy. ClOuDy. is a male
Pfadfinder


Avatar von ClOuDy.

Registration Date: 31.01.2010
Posts: 569
Program: PS CS5

Spacer
      

ich find das grauenhaft wenn jemand ein problem hat, die lösung findet und stillschweigend aus dem thema raus is unglücklich



Problem mit coding 20.10.2010 19:26 ClOuDy. is offline Search for Posts by ClOuDy.
 
Spacer
   
GFX-Sector
unregistered


 hat kein Avatar


Spacer

Have you enjoyed this topic?


If you were enjoying this post and if you keen on reading more interesting stuff then do not hesitate to complete the free sign up.

After the free registration you will gain access to all areas and you will be able to communicate with other artists from all over the world.

In addition you will benefit from our Photoshop and coding section as well as from our huge (hundreds of gigabytes) free resource section where you can find everything you will need to be a successful (web) designer/artist.

Sign up now and enjoy the advantages as a registered member.

(This website will be ad-free after a complete free sign up.)

New Post 20.10.2010 19:26  
Tree Structure | Board Structure
Post New Thread Post Reply
GFX-Sector » Coding Area » Webentwicklung » HTML, CSS » Problem mit coding

Similar topics to Problem mit coding
Thread
Robot mit Feuer Armen. :D (Forum: Signaturen/Avatare)
1. Sig mit Photoshop Cs3 (Forum: Signaturen/Avatare)
_Edit , Ananas, Dynamit, Ichi-nii und Noize (Forum: Gifts)
HTML Problem :( HILFE!! (Forum: HTML, CSS)
[Suche] Grafiker für Visitenkarte mit Bezahlung (Forum: Fragen & Probleme)