Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [css] ie7 input problem
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
prohol
23.08.2008, 21:24:12

witam

Mam problem z umieszczeniem w jednej lini inputa file i checkboxa. pod ff dziala natomiat pod ie7 checkbox przechodzi do nowej lini

Kod HTML

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html dir="LTR" lang="pl">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>cos</title>
  6. <link rel="stylesheet" type="text/css" href="adminstyles.css">
  7. </head>
  8. <body>
  9.   <div id="wrap">
  10.      <div id="adminTitle">Panel administratora</div>
  11.         <div id="adminContent">
  12.           <div style="text-align: center">Edytuj produkt</div>
  13.             <hr />
  14.              <form action="{$SEO->makeSeoProductLink($ln)}" method="post" enctype="multipart/form-data">
  15.                <fieldset class="addMusic">
  16.                  <div>
  17.                     <span id="filepath">text}</span>
  18.                     <label for="photo">Zdjęcie</label>
  19.                      <input type="file" id="photo" name="photofile" />
  20.                      <span> Usuń:<input type="checkbox" name="fields[]"  value="photo_path" class="del" /></span>
  21.                 </div>
  22.             </fieldset>
  23.          </form>
  24.        </div>
  25.      </div>
  26.     </body>
  27. </html>
[HTML] pobierz, plaintext


a to css 

[HTML] pobierz, plaintext 
  1. /*Admin panel    */
  2.   body,	html {
  3. 		margin:0;
  4. 		padding:0;
  5. 		color:#000;
  6. 	}
  7. 	body {
  8. 		min-width:750px;
  9.     text-align: center;
  10.     background: #DDD;
  11.   }
  12. 	#wrap {
  13.     background: #CCC;
  14. 		margin:0 auto;
  15. 		width: 1024px;
  16.     height: auto;
  17. 	}
  18.   #adminTitle {
  19.     text-align: center;
  20.     height: auto;
  21.     padding-top: 10px;
  22.     padding-bottom: 10px;
  23.     border: 2px solid black;
  24.   }
  25.   #adminMenu {
  26.     float: left;
  27.     width: 224px;
  28.     text-align: left;
  29.     border: 2px solid black;
  30.     padding: 10px 10px 10px 10px;
  31.     margin: 10px 5px 10px 0px;
  32.   }
  33.   #adminContent {
  34.     float: right;
  35.     width: 740px !important;
  36.     text-align: left;
  37.     border: 2px solid black;
  38.     padding: 10px 5px 10px 10px;
  39.     margin: 10px 0px 10px 10px;
  40.     voice-family: "\"}\""; 
  41.     voice-family:inherit;
  42.     width:  /**/780px;
  43.   }
  44. /* add music */
  45. #filepath {
  46. 		color: blue !important;
  47. 		font-size: smaller !important;
  48. 		font-family: monospace !important;
  49. 		font-style: italic !important;
  50. 		display:block;
  51. 			padding-left:150px;
  52. 			margin-top:-0.6em;
  53. 			font-size:0.9em;
  54. 			font-weight:normal;
  55. 	}
  56.  
  57. fieldset.addMusic {
  58. 	padding-top: 5px;
  59. 	font-size: 0.9em;
  60. 	font-weight:normal;
  61. }
  62. fieldset.addMusic div {
  63. 	clear: both;
  64. 	padding-top: 5px;
  65. 	padding-bottom: 5px;
  66.  
  67. }
  68.     /*fieldset.addMusic div#del{
  69.         clear: both;
  70.         position: relative;
  71.         width: 100px;
  72.         height: 30px;
  73.         top: -20px;
  74.         left: 400px;
  75.         left: 440px;
  76.         border: 2px solid red;
  77.     }*/
  78.  
  79.     fieldset.addMusic div span {
  80.         position: relative;
  81.         margin-left:80px;
  82.         display: inline;
  83.    }
  84.       fieldset.addMusic div input[type="checkbox"].del{
  85.         position: relative;
  86.       }
  87.  
  88. 	fieldset.addMusic label {
  89. 		width: 150px;
  90. 		float: left;
  91. 	}
  92.  
  93. 	fieldset.addMusic div input.price {
  94. 		width: 5em;
  95. 	}
  96.  
  97. 	fieldset.addMusic input {
  98. 		width: 20em;
  99. 	}
  100.  
  101. 	fieldset.addMusic div.save {
  102. 		text-align: center;
  103. 	}
  104. 	fieldset.addMusic textarea {
  105. 		width: 500px;
  106. 		height: 200px;
  107. 	}
[HTML] pobierz, plaintext


Pod ff wyglada dobrze, tzn jest zaraz za napisem Usuń
metal
26.08.2008, 11:39:18
zmodyfikuj kod:

[HTML] pobierz, plaintext 
  1. fieldset.addMusic div input[type="checkbox"].del{
  2. position: relative;
  3. }
[HTML] pobierz, plaintext


na:

[HTML] pobierz, plaintext 
  1. fieldset.addMusic div input.del{
  2. position: relative;
  3. width: 30px;
  4. }
[HTML] pobierz, plaintext


Po pierwsze nie miales ustalonej szerokości input dla klasy .del i byl on za szeroki. Dlatego nie miescil sie w jednej linii.
Po drugie jak tworzysz klase dla inputa to nie ma potrzeby okreslania jego typu taki zapis nie dziala 
[HTML] pobierz, plaintext 
  1. input[type="checkbox"].del
[HTML] pobierz, plaintext

Po trzecie nie mam ie7 wiec nie sprawdzilem czy to pomoglo ale mysle ze w tym jest problem. Pod ie6 i ff jest ok.

pozdrawiam
metal
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.