Beiträge von nieselfriem

nieselfriem

Problem gelöst

nieselfriem

Hallo ich habe das Problem, das meine HTML site und das mit meinem CSS bei einer 1024 auflösung ganz nett dargestellt wird. Wen ich jedoch die Bildschirmauflösung z.B. auf 1152x864 stelle verschiebt sich mein dargstelltes Formular nach unten.

HTML:

HTML

<!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" lang="de">
  <head><meta http-equiv="Content-type" content="text/html ; CHARSET=iso-8859-1"/>
    <title>TestRegistrierung</title>
    <link rel="stylesheet" type="text/css" href="css/basic.css" media="screen"/>
  </head>
  <body color="ffffff">
   <!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" lang="de">
  <head><meta http-equiv="Content-type" content="text/html ; CHARSET=iso-8859-1"/>
    <title>Test Registrierung</title>
    <link rel="stylesheet" type="text/css" href="css/basic.css" media="screen"/>
  </head>
  <body color="ffffff">

    <div id="header">
		 <h1>Agent Pepper</h1>
    </div>

    <div id="navigation">
	  <ul id="mainnavi">
            [*]
              [url='index.php']Start[/url]

            [*]
              [url='about.html']&Uuml;ber uns[/url]

            [*]
              [url='register.html']Registrierung[/url]

            [*]
              [url='impressum.html']Impressum[/url]

            [*]
              [url='kontakt.html']Kontakt[/url]

            [*]
              [url='formular2.php']Login[/url]

          <ul>                
    </div>
    <div id="sidebar">

    </div>
    <div id="content">
      <div id="formset">
        <form action="register.php" method="post">
          <fieldset><label>Pers&ouml;hnliche Daten</label> 
          <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
            <tr>
              <td>
               <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
                 <tr>  
	          <td align="left" width="150">Vertragsart</td>
                  <td width="133"><input type="radio" name="accountType" value="p">Privat</td>
	          <td width="133"><input type="radio" name="accountType" value="f">Firma</td> 	
	         </tr>
               </table>
              </td>
             </tr>
             <tr>
               <td>
                 <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
                   <tr>
                     <td align="left">
                       <select name="user_title" size="1">
		         <option selected>Herr</option>
		         <option>Frau</option>
	               </select>	
                     </td>
                   </tr> 
                 </table>
               </td> 
             <tr/>
             <tr>
               <td align="left">
                 <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
                   <tr>
                     <td align="left" >
                        [b]Vorname:[/b]


	        	<input name="vorname" value="" size="25" type="text" class="maintext"/>
		    <td align="left" width="*">
                        [b]Nachname:[/b]

		        <input name="nachname" value="" size="25" type="text" class="maintext"/>
                    </td>
                   </tr>
                 </table>
               </td>
             </tr>
             <tr>
               <td>
                 <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
                     <tr>
                       <td align="left" >[b]Firma:[/b]


        	         <input name="firmenname" value="" size="25" type="text" class="maintext"/>
                       </td>
                      </tr>
                  </table>
	       </td>	
             </tr> 
             <tr>
               <td>
                 <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
                   <tr>
                     <td align="left" >
                       [b]Geburtsdatum:[/b] (TT.MM.JJJJ)


						
							<select class="maintext" name="geburtstag">
								<option value="">--</option>

								<option value="01" >01</option>


								
								<option value="02" >02</option>

								<option value="31" >31</option>


								
							</select>   
							<select class="maintext" name="geburtsmonat">
								<option value="">--</option>

								<option value="01" >01</option>

								<option value="12" >12</option>

							</select>
							<select class="maintext" name="geburtsjahr">
								<option value="">--</option>



								<option value="1989" >1989</option>



								<option value="1900" >1900</option>

							</select>							

                     </td>   
                   </tr>
                 </table>
               </td> 
             </tr>
             <tr>
               <td>
                 <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
                   <tr>
                     <td align="left" >
                       [b]Passwort:[/b]


		       <input name="pass" value="" size="25" type="password" class="maintext"/>
                     </td>
                     <td align="left" width="*">
                     	[b]Passwort best&auml;tigen:[/b]


                        <input name="conf" value="" size="25" type="password" class="maintext"/>
                     </td> 
                   </tr>
                 </table>
               </td> 
             </tr>  
          </table>
        </fieldset>





        <fieldset><label>Adresse</label>
          <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
            <tr>
              <td align="left">[b]Stra&szlig;e / Hausnr:[/b]</td>
	      <td align="left">[b]PLZ / Ort:[/b]</td>
            </tr>
            <tr>
              <td align="left">
                <input name="strasse" maxlength="25" value="" size="14" type="text" class="maintext" />
		<input name="hausnr" maxlength="25" value="" size="5" type="text" class="maintext" />
              </td>
              <td align="left">
                <input name="plz" maxlength="5" value="" size="5" type="text" class="maintext" />
                <input name="ort"  value="" size="14" type="text" class="maintext" />
              </td>    
            </tr> 
          </table>
        </fieldset>





         <fieldset><label>Telefon/Fax und E-Mail</label> 
           <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
             <tr>
               <td align="left" >
                 [b]Email:[/b]


		<input name="mail" value="" size="25" type="text" class="maintext"/>
               </td>
               <td align="left" width="*">
                 [b]Telefon:[/b]

		  <input name="tel" value="" size="25" type="text" class="maintext"/>
               </td>
             </tr>
             <tr>
               <td align="left" >
                 [b]Email wiederholen:[/b]


		 <input name="emailconf" value="" size="25" type="text" class="maintext"/>
		<td align="left" width="*">
                  [b]Fax:[/b]

		  <input name="fax" value="" size="25" type="text" class="maintext"/>
               </td>
             </tr> 
           </table>
         </fieldset>





        <fieldset><label>Absenden</label>
          <table border="1" width="400px" cellpadding="0" cellspacing="2" border="0" class="maintext">
            <tr>
              <td>
                <input type="submit" name="senden" value="Absenden"/>
              </td>
              <td>
                <input type="reset" name="reset" value="Eingaben l&ouml;schen"/>
              </td>
            </tr>
          </table>
        </fieldset>  	   
        </form>   
       </div>  
     </div>
</body>
</html>

Alles anzeigen

CSS:

Code

#body {
font-size: 85%;
font-famliy: 'Trebuchet MS', Verdana, Arial, Sans-Serif;
text-align: center;
}


#wrap {
width: 900px;
margin: 0 ;
text-align: center;
}


#formset{
width: 900px;
margin: 0 ;
text-align: left;
}


#header {
float: left;
width: 900px;
height: 100px;
text-align: center;
border-top: 1px solid #999;
}


#navigation {
float: left;
width: 900px;
height: 50px;
border-bottom: 1px solid #999;
border-top: 1px solid #999;
top:0px;
left:0px;
background-color:rgb(100,180,250);
z-index:1;
}


 



#sidebar {
float: left;
width: 150px;
height: 400px;
top: 0;


}


#content {
float: left;
width: 700px;
height: 400px;
border-right: 1px solid #999;
border-left: 1px solid #999;
top: 0;
}


#current {
  background: url(bg_menuitem.gif)
  #979797 repeat-x 0px -160px;
  color: #fff;
  cursor: default;
  padding: 0 15px;
}




#mainnavi li {
  border-right: 1px solid #676767;
  display: inline;
}


#mainnavi li a {
  color: #fff;
  padding: 0 15px;
  text-decoration: none;
}


#mainnavi li a:hover {
  background: url(bg_menuitem.gif)
  #676767 repeat-x 0px -80px;
  text-decoration: none;
}


#form {
text-align:left;
width:700px;
}












#navigation ul {
list-style-type: none;
}


#navigation ul li {
display: inline;
}




h1, h2, h3, h4, h5, h6 {
margin: 20px;
}


p.boxtext {


border: 1px solid #000;
padding: 5px;


}


p {
margin: 15px 20px;
}


#list {
list-style-position:outside;
}


form {
width:500px;
}


#person label {
display:block;
font-weight: bold;
text-align:left;
}


#aktivierung label {
display:block;
font-weight: bold;
}


#login label {
display:block;
font-weight: bold;
}


fieldset { 
 border: 1px solid #dbd; 
 width:650px; 
 background: #fafafa; 
 } 
 
 .fieldset_2 { 
 border: 1px solid #dbd; 
 width:625px; 
 background: #fafafa; 
 }


legend {
font-weight: bold;
font-size: 120%;
color: #999;
}


textarea {
width: 425px;
heigth: 125px;
}


a.navi,a.navi_first,a.navi_self{
display:block;
white-space:nowrap;
overflow:hidden;
border-left:1px solid black;
border-right:1px solid black;
border-bottom:1px solid black;
font-family:Tahoma,sans-serif;
font-size:12px;
font-weight:bold;
text-decoration:none;
letter-spacing:0.1em;
padding:3px;
text-align:center;
}
a.navi_first {
border-top:1px solid black;
}


a.navi:link,a.navi:link,a.navi:visited,a.navi_first:visited {
background-color:rgb(115,115,75);
color:white;
}


a.navi_self:link,a.navi_self:visited {
background-color:gray;
color:white;
}


a.navi:hover,a.navi_first:hover,a.navi_self:hover,a.navi:active,a.navi_first:active,a.navi_self:active {
background-color:white;
color:black;
}






#navcontainer
{
margin-left: auto;
margin-right: auto;
margin-bottom: 40px;
border-top: 1px solid #999;
z-index: 1;
}

Alles anzeigen

Was kann ich dagegen mache. Ich habe doch egentlich alles mit absoluten Positionen festgelegt.

Danke für den Tipp!

P.S. Sorry für die langes Codes, wollte nur evtl wichtige Details nicht weglassen

nieselfriem

ok wenn du das sagst das das mit tabelle ok ist werde ich diesen weg gehen. wollte auch eine meinung hören in diesem zusammenhang weil tabelle als gestaltungsmittel sonst als verpönt gilt

gruß niesel

nieselfriem

Hallo kennt jemand eine anleitung ein Webformular mittels CSS zuu formatieren.
Das was ich bisher gefunden habe sind alle eingabemöglichkeiten untereinander.
Ich möchte jedoch z.B. Name und Vorname auf einer Zeile haben und es vermeiden das in der weiteren Zeile duch eine längere bezeichnung des eingabefeldes die eingabefleder auf unterschiedlichen positionen sind.

bsp:

Name [Textfeld] Vorname [Textfelf
Anschrift [textfeld]

das möchte ich vermeiden und wollte auch keine Tabelle dafür verwenden

Ich hoffe ich habe mich einigermaßen verständlich ausgedrückt

Gruß niesel

nieselfriem

na ich habe doch das

Code

<fieldset><legend>testform</legend>....
<fieldset><legend>Abschicken></legend>//ragt raus
...
</fieldset>
</fieldset>

nieselfriem

Hallo ich habe folgendes css

CSS:

Code

#body {
font-size: 85%;
font-famliy: 'Trebuchet MS', Verdana, Arial, Sans-Serif;
text-align: center;
}


#wrap {
width: 900px;
margin: 0 ;
text-align: center;
}


#header {
float: left;
width: 900px;
height: 100px;
text-align: center;
border-top: 1px solid #999;
}


#navigation {
float: left;
width: 900px;
height: 50px;
border-bottom: 1px solid #999;
border-top: 1px solid #999;
top:0px;
left:0px;
background-color:rgb(100,180,250);
z-index:1;
}


 



#sidebar {
float: left;
width: 150px;
height: 400px;
top: 0;


}


#content {
float: left;
width: 700px;
height: 400px;
border-right: 1px solid #999;
border-left: 1px solid #999;
top: 0;
}


#current {
  background: url(bg_menuitem.gif)
  #979797 repeat-x 0px -160px;
  color: #fff;
  cursor: default;
  padding: 0 15px;
}




#mainnavi li {
  border-right: 1px solid #676767;
  display: inline;
}


#mainnavi li a {
  color: #fff;
  padding: 0 15px;
  text-decoration: none;
}


#mainnavi li a:hover {
  background: url(bg_menuitem.gif)
  #676767 repeat-x 0px -80px;
  text-decoration: none;
}


#form {
text-align:left;
width:700px;
}
#navigation ul {
list-style-type: none;
}


#navigation ul li {
display: inline;
}




h1, h2, h3, h4, h5, h6 {
margin: 20px;
}


p.boxtext {


border: 1px solid #000;
padding: 5px;


}


p {
margin: 15px 20px;
}


#list {
list-style-position:outside;
}


form {
width:500px;
}


#person label {
display:block;
font-weight: bold;
text-align:left;
}


#aktivierung label {
display:block;
font-weight: bold;
}


#login label {
display:block;
font-weight: bold;
}


fieldset {
border: 1px solid #dbd;
width:650px;
background: #fafafa;
}


legend {
font-weight: bold;
font-size: 120%;
color: #999;
}


textarea {
width: 425px;
heigth: 125px;
}


a.navi,a.navi_first,a.navi_self{
display:block;
white-space:nowrap;
overflow:hidden;
border-left:1px solid black;
border-right:1px solid black;
border-bottom:1px solid black;
font-family:Tahoma,sans-serif;
font-size:12px;
font-weight:bold;
text-decoration:none;
letter-spacing:0.1em;
padding:3px;
text-align:center;
}
a.navi_first {
border-top:1px solid black;
}


a.navi:link,a.navi:link,a.navi:visited,a.navi_first:visited {
background-color:rgb(115,115,75);
color:white;
}


a.navi_self:link,a.navi_self:visited {
background-color:gray;
color:white;
}


a.navi:hover,a.navi_first:hover,a.navi_self:hover,a.navi:active,a.navi_first:active,a.navi_self:active {
background-color:white;
color:black;
}






#navcontainer
{
margin-left: auto;
margin-right: auto;
margin-bottom: 40px;
border-top: 1px solid #999;
z-index: 1;
}

Alles anzeigen

HTML:

HTML

<!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" lang="de">
<head><meta http-equiv="Content-type" content="text/html ; CHARSET=iso-8859-1"/>
<title Registrierung</title>
<link rel="stylesheet" type="text/css" href="css/basic.css" media="screen"/>
</head>
<body color="ffffff">
<div id="wrap">
	<div id="header">
		 <h1>Registrierung</h1>
	</div>
	<div id="navigation">
		<ul id="mainnavi">
          [*]
            [url='index.php']Start[/url]

          [*]
            [url='about.html']&Uuml;ber uns[/url]

          [*]
            [url='register.html']Registrierung[/url]

          [*]
            [url='impressum.html']Impressum[/url]

          [*]
            [url='kontakt.html']Kontakt[/url]

          [*]
            [url='formular2.php']Login[/url]

        <ul>                
	</div>

	<div id="sidebar">



	</div>	 
      <div id="content">
		<h1>Kontakt</h1>

        <div id="form">
        <form action="register.php" method="post">
       <fieldset><legend>Testform</legend>
<label for="name">Name*:</label>
<input type="text" name="name" size=25>
<label for="name">vorname*:</label>
<input type="text" name="vorname" size=25>
<fieldset><legend>Abschicken</legend>
<label for="senden">Abschicken</label>




<input type="submit" name="senden" value="wech damit"></p>


</fieldset>
</fieldset>


	
	</form> 	
</div>
	</div>


</div>


</body>
</html>

Alles anzeigen

nur ist es wie gesagt ist es leider so, dass rechts dann das "Unter-Fieldset" herausragt.
Wie bekomm ich das weg?

Gruß niesel

nieselfriem

habe jetzt folgendes gemacht

Code

a#home {

	   bottom:0px;
            margin-left:199px;
            z-index:3;
         }


a#about {

	   bottom:0px;
            margin-left:301px;
            z-index:4;
         }


a#register {

	   bottom:0px;
            margin-left:400px;
            z-index:4;

Alles anzeigen

jedoch werden die Buttons in treppenform dargestellt

gruß niesel

nieselfriem

alles klar * jedoch habe ich da noch ein weiters problem.

das css sieht nun folgendermaßen aus:

Code

#body {
font-size: 85%;
font-famliy: 'Trebuchet MS', Verdana, Arial, Sans-Serif;
text-align: center;
}


#wrap {
width: 900px;
margin: 0 ;
text-align: center;
}


#header {
float: left;
width: 1000px;
height: 110px;
text-align: center;
border-top: 1px solid #999;
}


#navigation {
float: left;
width: 1000px;
height: 60px;
border-bottom: 1px solid #999;
border-top: 1px solid #999;
top:0px;
left:0px;
background-color:rgb(230,180,250);
z-index:1;
}


 



#sidebar {
float: left;
width: 150px;
height: 400px;
top: 0;


}


#content {
float: left;
width: 700px;
height: 400px;
border-right: 1px solid #999;
border-left: 1px solid #999;
top: 0;
}








#navigation ul {
list-style-type: none;
}


#navigation ul li {
display: inline;
}




h1, h2, h3, h4, h5, h6 {
margin: 20px;
}


p.boxtext {


border: 1px solid #000;
padding: 5px;


}


p {
margin: 15px 20px;
}


#list {
list-style-position:outside;
}


form {
width:450px;
}


#person label {
display:block;
font-weight: bold;
}


#aktivierung label {
display:block;
font-weight: bold;
}


#login label {
display:block;
font-weight: bold;
}


fieldset {
border: 1px solid #dbd;
background: #fafafa;
}


legend {
font-weight: bold;
font-size: 120%;
color: #999;
}


textarea {
width: 425px;
heigth: 125px;
}


a.navi,a.navi_first,a.navi_self{
display:block;
white-space:nowrap;
overflow:hidden;
border-left:1px solid black;
border-right:1px solid black;
border-bottom:1px solid black;
font-family:Tahoma,sans-serif;
font-size:12px;
font-weight:bold;
text-decoration:none;
letter-spacing:0.1em;
padding:3px;
text-align:center;
}
a.navi_first {
border-top:1px solid black;
}


a.navi:link,a.navi:link,a.navi:visited,a.navi_first:visited {
background-color:rgb(115,115,75);
color:white;
}


a.navi_self:link,a.navi_self:visited {
background-color:gray;
color:white;
}


a.navi:hover,a.navi_first:hover,a.navi_self:hover,a.navi:active,a.navi_first:active,a.navi_self:active {
background-color:white;
color:black;
}


a.top_link {
            display:block;
            position:absolute;
            width:100px;
            text-align:center;
            height:18px;
            font-family:"MS Sans Serif",sans-serif;
            font-size:12px;
            font-weight:bold;
            padding-top:1px;
            text-decoration:none;
         }
         a.top_link:link, a.top_link:visited {
            color:rgb(150,50,170);
            background-image:url(reiter1.gif);
            background-repeat:no-repeat;
            background-color:rgb(245,240,205);
         }       
         a.top_link:hover, a.top_link:active {
            color:black;
            background-image:url(reiter2.gif);
            background-position:top right;
            background-repeat:no-repeat;
            background-color:white;


}


a#home {

	   bottom:0px;
            left:100px;
            z-index:3;
         }


 a#home:hover, a#home:active,
         a#news:hover, a#news:active,
         a#game:hover, a#game:active,
         a#cheats:hover, a#cheats:active,
         a#comm:hover, a#comm:active,
         a#impr:hover, a#impr:active {
            z-index:9;
         }

Alles anzeigen

die htmldatei

HTML

<!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" lang="de">
<head><meta http-equiv="Content-type" content="text/html ; CHARSET=iso-8859-1"/>
<title>Test</title>
<link rel="stylesheet" type="text/css" href="css/basic.css" media="screen"/>
</head>
<body color="ffffff">


<div id="wrap">
	<div id="header">
		 <h1>Agent Pepper</h1>
	</div>
	<div id="navigation">
		<ul>
          [*]
            [url='index.php']Start[/url]

          [*]
            [url='about.html']&Uuml;ber uns[/url]

          [*]
            [url='register.php']Registrierung[/url]

          [*]
            [url='impressum.html']Impressum[/url]

          [*]
            [url='kontakt.html']Kontakt[/url]

          [*]
            [url='formular2.php']Login[/url]

        <ul>                
	</div>
	<div id="sidebar">
	 <a class="navi_self navi_first" href="test.html">
	   Home
         </a>	
        <a class="navi_self navi_first" href="test.html">
	   Zwiebeln
         </a>	
	<a class="navi_self navi_first" href="test.html">
	   Produkte
         </a>	
	<a class="navi_self navi_first" href="test.html">
	   Tipps & Tricks
         </a>	

	</div>	 


	<div id="content">
		<h1>Kontakt</h1>





       Willkomen bei Test Wir sind ein bablabla unternehmen um fragebögen usw zu erstellen. dies ist lusig und mach spaß und hoffen auf viel Geld 
        </p>


	</div>


</div>


</body>
</html>

Alles anzeigen

nu ist es so, der Button "Start" statt im Navibereich unten herumspringt. Sicher wieder das gleiche prob wie vorhin mit dem wrapper. Abewr ich komm nicht drauf, was ich noch machen kann.

Gruß niesel

nieselfriem

Hallo!

Habe folgendes Script
HTML:

HTML

<!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" lang="de">
<head><meta http-equiv="Content-type" content="text/html ; CHARSET=iso-8859-1"/>
<title>Hallo</title>
<link rel="stylesheet" type="text/css" href="css/basic.css" media="screen"/>
</head>
<body color="ffffff">


<div id="wrap">
	<div id="header">
		 <h1>Titel</h1>
	</div>
	<div id="navigation">
		<ul>
          [*]
            [url='index.php']Start[/url]

          [*]
            [url='about.html']&Uuml;ber uns[/url]

          [*]
            [url='register.php']Registrierung[/url]

          [*]
            [url='impressum.html']Impressum[/url]

          [*]
            [url='kontakt.html']Kontakt[/url]

          [*]
            [url='formular2.php']Login[/url]

        <ul>                
	</div>

	<div id="sidebar">




sdsd</p>

	</div>	 
	<div id="content">
		<h1>Kontakt</h1>





       Text blabla
        </p>


	</div>

</div>


</body>
</html>

Alles anzeigen

CSS:

Code

#body {
font-size: 85%;
font-famliy: 'Trebuchet MS', Verdana, Arial, Sans-Serif;
text-align: center;
}


#wrap {
width: 760px;
margin: 0 ;
text-align: center;
}


#header {
float: left;
width: 800px;
height: 110px;
text-align: center;
border-top: 1px solid #999;
}


#navigation {
float: left;
width: 800px;
height: 40px;
border-bottom: 1px solid #999;
border-top: 1px solid #999;
}


#sidebar {
float: left;
width: 150px;
height: 400px;
top: 0;


}


#content {
float: left;
width: 600px;
height: 400px;
border-right: 1px solid #999;
border-left: 1px solid #999;
top: 0;
}








#navigation ul {
list-style-type: none;
}


#navigation ul li {
display: inline;
}




h1, h2, h3, h4, h5, h6 {
margin: 20px;
}


p.boxtext {


border: 1px solid #000;
padding: 5px;


}


p {
margin: 15px 20px;
}


#list {
list-style-position:outside;
}


form {
width:450px;
}


#person label {
display:block;
font-weight: bold;
}


#aktivierung label {
display:block;
font-weight: bold;
}


#login label {
display:block;
font-weight: bold;
}


fieldset {
border: 1px solid #dbd;
background: #fafafa;
}


legend {
font-weight: bold;
font-size: 120%;
color: #999;
}


textarea {
width: 425px;
heigth: 125px;
}

Alles anzeigen

Wenn ich jedoch den Content bereich im CSS auf z.B. 700px vergrößern will rutsch dieser nach unten obwohl doch genügend platz sein sollte nach rechts heraus. Was kann ich da machen.

Gruß niesel

nieselfriem

thx!!!

nieselfriem

nö bringts nicht

gruß niesel

nieselfriem

die beste Variante ist meiner meinung nach ein script in php mit einer mysqlanbindung. und session management seitens php So weit ich weiß ist dies am sichersten was uns "normaluser" betrifft bei intresse kannich dir gern solch ein script zeigen mit tabellenerstellung in mysql und dem ganzen kram der dazu gehört

Gruß niesel

nieselfriem

Hallo ich habe folgenden Code aus einem Buch abgetippelt
HTML:

HTML

<!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>  
    <title>test</title> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <script type="text/javascript">  /* <![CDATA[ */    /* ]]> */ </script>
    <link rel="stylesheet" type="text/css" href="css/styles.css" media="screen"/>
  </head>
  <body>	
    <div id="header">		



Kopf</p>	
    </div>	
    <div id="navigation">		



Navigation</p>
     </div>	


    <div id="content">



Inhalt</p>	
    </div>
    <div id="features">



Features</p>	
    </div>
  </body>
</html>

Alles anzeigen

CSS:

Code

html, body{	
background-color: white;	
margin: 0px;	
padding: 0px;
}


#header {	
background-color: rgb(190,215,235);	
width: 100%;	
height: 100px;	
padding: 0px;	
margin: 0px;
}


#navigation 
{	
 	position:absolute;
	background-color:rgb(210,235,255);
	top:100px;
	left:0px;
	width:180px;
	padding: 0px;
margin: 0px;
 }
#content{


	margin-top: 0px;
	margin-left: 180px;
	margin-right: 180px;
	background-color:blue;
        }
#features{	
position: absolute;	
background-color: rgb(210,235,255);	
top: 100px;	
right: 0px;	
width: 180px;	
margin: 0px;	
padding: 0px;
}

Alles anzeigen

Laut Buch sollte der Kopf oben am Rand sein. Die Navigation und features eben drunter exakt abschliessen. Jedoch ist immer ein weißer rand bei mir beim Kopf auf der oberseite. und die Navigation und Features ragen in den Kopf rein und sind zu dick.

ICh habe das CSS exakt abgetippelt. Was ist da verkehrt?

Gruß niesel

Beiträge von nieselfriem

CSS Firefox und Bildschirmauflösung

CSS Firefox und Bildschirmauflösung

Formular

Formular

Fieldset im Fieldset ragt rechts heraus

Fieldset im Fieldset ragt rechts heraus

kleines Problem mit css

kleines Problem mit css

kleines Problem mit css

CSS Lücke am oberen Rand und überlapende Objekte

CSS Lücke am oberen Rand und überlapende Objekte

Passwortabfrage

CSS Lücke am oberen Rand und überlapende Objekte