Автор Тема: Имам проблем с браузърите  (Прочетена 51734 пъти)

rumen6787

  • Гост
Имам проблем с браузърите
« -: Sep 03, 2011, 13:42 »
Когато се прави страница с html css без javascript, php и таблици във всеки познат браузер. Как да я направя съвместима с всеки браузер? Имам 17 инчов монитор и като отворя браузери като мозила файърфокс, опера, гугъл хром и виждам, че елементите на страничката са разместени. задавам определени параметри, за да могат всички елементи да центрирани. по принцип всяка страница е с размер 1024х768 пиксела или в зависимост от монитора, колко инчов е.

мога да ви пратя кода тук:
който мопже, нека да помогне със съвет и предварително благодаря.
Активен

lamer40

  • Напреднали
  • *****
  • Публикации: 29
    • Профил
Re: Имам проблем с браузърите
« Отговор #1 -: Sep 03, 2011, 21:42 »
В тоя формат на компресирания архив, едва ли някой ще си направи труд да ти отговори. По-правилно е да питаш в туриста или моя тех, там се намират ламери дето се ловят на така зададен въпрос.
Активен

rumen6787

  • Гост
Re: Имам проблем с браузърите
« Отговор #2 -: Sep 03, 2011, 22:30 »
Цитат на: lamer40 в Sep 03, 2011, 21:42
В тоя формат на компресирания архив, едва ли някой ще си направи труд да ти отговори. По-правилно е да питаш в туриста или моя тех, там се намират ламери дето се ловят на така зададен въпрос.

а ти като видиш кода и си поиграеш, тогава можеш да ме назовеш ламер. именно ламерите ако имат желание ще ми отговорят. при различните браузери виждането е различно. но въпросът ми е как да се направи така, че да работи безупречно под IE, Mozilla Firefox, Google Chrome, Safari, Opera. сега мисля, че съм по ясен, дори и за ламерите. Нали за това е форума. Да попиташ на място и да получиш отговор при правилно формулиран въпрос.

Един познат в курса по IT Essentials сподели:

"Няма неправилен отговор - има неправилен въпрос."

Сега можеш да изтеглиж кода и да ми кажеш най учтиво по ламерски ако желаеш, дали при различните браузери елементите са разместени.
Да сложиш по един коментар от рода на: ( в css /*това не върви под IE*/ или нещо подобно.
Активен

b2l

  • Напреднали
  • *****
  • Публикации: 4786
  • Distribution: MCC Interim
  • Window Manager: - // - // -
  • ...sometimes I feel like screaming... || RTFM!
    • Профил
    • WWW
Re: Имам проблем с браузърите
« Отговор #3 -: Sep 04, 2011, 17:42 »
http://en.wikipedia.org/wiki/Cross-browser
Активен
"Човекът е въже, опънато между звяра и свръхчовека, въже над пропаст. Човекът е нещо, което трябва да бъде превъзмогнато." - Фр. Ницше

rumen6787

  • Гост
Re: Имам проблем с браузърите
« Отговор #4 -: Sep 06, 2011, 08:46 »
С много играчка стигнах до заключениоето: Че да не ми се разместват елементите в страницата и да се вижда еднакво от всички браузъри (разлиствачи, които ти помагат да разглеждаш множество страници в интернет), е да си поиграя с margin-top, margin-right, margin-bottom, margin-left - това са обектите за изравняване на елементите за опеределянето им между границите в браузъра и самите тях. поиграх си и с padding-top, padding-right, padding-bottom, padding-left - това е разстоянието между текста и обектите в самото съдържание на елементите. например вие искате да нашишете текст в съдържанието със css. стилизирайте страницата html и поставяйте div етикети където е необходимо. има един много интересен сайт на български език с видеоуроци по уебдизайн и уеб програмиране: http://videotutorials-bg.com и един сайт на английски: http://www.w3schools.com. след като научите правилното кодиране е необходимо да си валидирате сайта, страницата или css кода на: http://jigsaw.w3.org/css-validator/. така ще видите дали имате грешки в кодирането.  когато се установи, че имате грешки, следвайте внимателно инструкциите и тогава няма да имате грешки в кодирането на страниците ви. пожелавам ви успешно кодираане и валидиране.
« Последна редакция: Sep 06, 2011, 08:48 от rumen6787 »
Активен

b2l

  • Напреднали
  • *****
  • Публикации: 4786
  • Distribution: MCC Interim
  • Window Manager: - // - // -
  • ...sometimes I feel like screaming... || RTFM!
    • Профил
    • WWW
Re: Имам проблем с браузърите
« Отговор #5 -: Sep 06, 2011, 08:51 »
Гледай сега - ако страницата ти е направена като таблица няма да се мести на различните браузъри: IE5, 6, 7, 8, 9, FF, Chrome, Opera, Safari, etc. Сега, до колко е удачно да се правят страници с <table>, <tr>, <td> вече е друг въпрос.

PS: Гледам, че последния ти пост е нещо като обощаващ, нека да допълня, че за IE6 се пише отделен css, който се зарежда с проверка дали потребителя използва browser = IE6.
Активен
"Човекът е въже, опънато между звяра и свръхчовека, въже над пропаст. Човекът е нещо, което трябва да бъде превъзмогнато." - Фр. Ницше

rumen6787

  • Гост
Re: Имам проблем с браузърите
« Отговор #6 -: Sep 06, 2011, 09:58 »
Код
GeSHi (HTML):
  1. !--[if IE]>
  2.         <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
  3. <![endif]-->
  4.  
  5. !--[if IE 7]>
  6.         <link rel="stylesheet" type="text/css" href="ie7.css">
  7. <![endif]-->

http://css-tricks.com/132-how-to-create-an-ie-only-stylesheet/

предполагам че затова ми говориш.
преди съм правил страници с таблици и когато съм искал да напиша нещо много дълго, страницата или таблицата се удължава много на дълго надолу и понякога елементите пак са се размествали. снощи разучавах как се стилизират таблици c css.
Код
GeSHi (HTML):
  3. <style type="text/css" media="screen">
  4. body {
  5. margin: 0 auto;
  6. padding: 0 auto;
  7. background-color: #333333;
  8. }
  9.  
  10. #wrapper{
  11. width: 800px; 
  12. height: 900px; 
  13. margin: 0 auto; 
  14. padding: 0 auto;
  15. }
  16.  
  17. #header {
  18. width: 750px;
  19. height: 150px;
  20. background-color: #f09;
  21. margin-top: -105px;
  22. margin-right: 75px;
  23. margin-bottom: 5px;
  24. margin-left: 15px;  
  25. padding: 0 auto; 
  26. position: absolute;
  27. }
  28.  
  29. table {
  30. width: 100%;
  31. height: 50%;
  32. table-layout: 0px;
  33. border-collapse:collapse;
  34. }
  35. table, td, th{
  36. border-width: 0px;
  37. color: #000;
  38. font-family: Arial, Helvetica, sans-serif;
  39. font-size: 12pt;
  40. text-indent: 5px; 
  41. text-align: justify;
  42.  
  43.  
  44.  
  45. #container {
  46. width: 750px;
  47. height: 700px;
  48. background-color: #fc7; 
  49. margin-top: 105px;
  50. margin-right: 75px;
  51. margin-bottom: 0px;
  52. margin-left: 15px;  
  53. padding: 0 auto; 
  54. overflow: auto; 
  55. }
  56.  
  57. #h1 {
  58. margin-top: 80px;    
  59. margin-left: 5px;
  60. margin-bottom: 4px; 
  61. margin-right: 45px;  
  62. padding-top: 5px;
  63. padding-right: 15px; 
  64. padding-bottom: 1px;
  65. padding-left: 45px;  
  66. font-family: "Times New Toman", Times, Georgia, serif; 
  67. font-size: 35px;
  68. font-style:  normal;
  69. font-weight: bold; 
  70. color: #f00;  
  71. text-align: left;
  72. text-indent: 10px;
  73. position: absolute;
  74. float: left;
  75. }
  76.  
  77. #h2{
  78. margin-top: 90px; 
  79. margin-right: 80px;
  80. margin-bottom:  5px;
  81. margin-left: 25px;   
  82. padding-top: 5px;
  83. padding-right: 20px; 
  84. padding-bottom: 1px;
  85. padding-left: 15px;   
  86. font-family:  Arial. Tahoma, sans-serif; 
  87. font-size: 40px;
  88. font-weight: bold; 
  89. font-style:  normal; 
  90. color: #f0f;  
  91. text-align: justified; 
  92. text-indent: 5px; 
  93. position: absolute;
  94. float: left;
  95. }
  96.  
  97. #button {
  98. margin-top: 200px;
  99. margin-left: 45px;  
  100. margin-bottom: 0px;
  101. padding-left: 2px;
  102. }
  103.  
  104. #h3 {
  105. margin-top: 15px; 
  106. margin-right: 80px;
  107. margin-bottom:  5px;
  108. margin-left: 25px;   
  109. padding-top: 5px;
  110. padding-right: 20px; 
  111. padding-bottom: 1px;
  112. padding-left: 15px;   
  113. font-family:  Arial. Tahoma, sans-serif; 
  114. font-size: 25px;
  115. font-weight: bold; 
  116. font-style:  normal; 
  117. color: #f0f;  
  118. text-align: justified; 
  119. text-indent: 5px; 
  120. position: absolute;
  121. clear: both;
  122. }
  123.  
  124. #h4 {
  125. margin-top: 125px;  
  126. margin-right: 80px;
  127. margin-bottom:  5px;
  128. margin-left: 25px;   
  129. padding-top: 5px;
  130. padding-right: 20px; 
  131. padding-bottom: 1px;
  132. padding-left: 15px;   
  133. font-family:  Arial. Tahoma, sans-serif; 
  134. font-size: 25px;
  135. font-weight: bold; 
  136. font-style:  normal; 
  137. color: #f0f;  
  138. text-align: justified; 
  139. text-indent: 5px; 
  140. position: absolute;
  141. clear: both;
  142. }
  144. </head>
  146. <div id="wrapper">
  147. <div id="header"> 
  148. <div id="table"
  149. <table align="center" cellpadding="5" cellspacing="5">
  150. <tr>
  151. <th>&nbsp;</th>
  152. <td>&nbsp;</td>
  153. </tr>
  154. <tr>
  155. <th>&nbsp</th>
  156. <td>&nbsp;</td>
  157. </tr>
  158. <tr>
  159. <th rowspan 2>&nbsp</th>
  160. <td colspan 2>&nbsp</td>
  161. </tr>
  162. <tr>
  163. <th>&nbsp;</th>
  164. <td>&nbsp;</td>
  165. </tr>
  167. </div>
  168. </div>
  169. <br/>
  170. <div id="h1></div>
  171. <div id="h2"></div>
  172. <div id="h3"></div>
  173. <div id="h4"></div>
  174. </div>
  175. </body>
  176. </html>

може и да съм пропуснал някоя грешка. поправяйте.
« Последна редакция: Sep 06, 2011, 11:39 от VladSun »
Активен

bop_bop_mara

  • Напреднали
  • *****
  • Публикации: 2433
  • Distribution: Debian Testing
  • Window Manager: LXDE
  • Cute and cuddly
    • Профил
Re: Имам проблем с браузърите
« Отговор #7 -: Sep 06, 2011, 11:37 »
21 век сме, стига с това подреждане на базата на таблици. Таблиците са за таблични данни.  ;)
Активен

ismailov

  • Напреднали
  • *****
  • Публикации: 465
  • Distribution: ubuntu,mint,xubuntu
  • Window Manager: Xfce,lxde,cinamon,Gnome
    • Профил
    • WWW
Re: Имам проблем с браузърите
« Отговор #8 -: Sep 06, 2011, 11:46 »
за това си ползвам wordpress и joomla и нямам проблеми с таблици
Активен

rumen6787

  • Гост
Re: Имам проблем с браузърите
« Отговор #9 -: Sep 06, 2011, 15:13 »
преди да се появят joomla & wordpress или drupal. хората са правили страниците на ръка, и са поставяли таблиците в сайтовете си за подравняване на обектите. и севга пак ги ползват тези таблици за обработка на данни, заявки, поръчки, покупки. Таблиците се ползват в MySQL, JQuery, HTML, но CSS ги стилизира. дори в joomla, drupal, wordpress, вероятно има и други Content Management Systems, в които някои са се потрудили здравата, да помогнат на бъдещите уебдизайнери и кодери да ползват продуктите им срещу дарение, защото и свободният (отвореният) код си иска дарение, за да се поддържа и програмистите и истинските учтиви хакери да се издържат. няма нищо безплатно, и това го знаят повече хора. Темата е как да накарам всички браузъри да работят когато си зареждам страницата, за да не виждам разместени елементи. Проблемът е в мен, не съм написал правилно кода за стилизиране. наложи се да си поиграя с кода за стилизиране. и затова не съм сложил таблици, защото в повечето случаи таблиците правят много поразии. вие как мислите?
Активен

b2l

  • Напреднали
  • *****
  • Публикации: 4786
  • Distribution: MCC Interim
  • Window Manager: - // - // -
  • ...sometimes I feel like screaming... || RTFM!
    • Профил
    • WWW
Re: Имам проблем с браузърите
« Отговор #10 -: Sep 06, 2011, 15:20 »
Цитат на: rumen6787 в Sep 06, 2011, 15:13
вие как мислите?

За кое как мислим бе човек? Имам чувството, че очакваш с 2-3-4 коментара да ти се обясни как да си направиш cross browser-а. А това си е най-шибаната задача в цялото web програмиране. И в крайна сметка, за изключиш поддръжката на IE6 съм сигурен, че каквото и да напишеш като css ще излиза еднакво на FF, Opera, Chrome, etc.

PS: Виждам, че искаш да се покажеш, че си чел (малко), но нямаше нужда да намесваш релациите.
Активен
"Човекът е въже, опънато между звяра и свръхчовека, въже над пропаст. Човекът е нещо, което трябва да бъде превъзмогнато." - Фр. Ницше

rumen6787

  • Гост
Re: Имам проблем с браузърите
« Отговор #11 -: Sep 06, 2011, 16:15 »
няма нужда, аз вече го оправих. нали ти казах, че намерих разрешение на проблема. не знам кой колко чете и какво чете. но дори и един копнат или пренаписан код не може да ви се представи. аз поисках компетентно мнение, но няма да мога да го намеря тук. но както и да е. първо бях, критикуван, че въпроса ми е като на ламер. а колкото до ламерството всеки от там е започнал, но не искате да си признаете. все пак се опитах да се придържам към темата според изискванията на модератора. и все пак е добре да има по компетентно мнение от моето или това колко съм чел или не съм чел. та обяснете ми на практика за crossbrowser като техники или трикове. има трикове за всеки броузер по отделно, но не можеш да сложиш всички трикчета в един код. мене това ме вълнува но като гледам май има по на 19-24 години. а може и 14-18 г. знам ли. и все пак благодаря на всеки за критиките. мисля, че аз ви споделих нещо като нищо или зленаписан или копнат код, но както и да е. няма за какво да се засягам. колкото за релациите имаш право, но таблиците се позлват във всички сайтове, дори в гугъл се използват. отворете си браузърите който и да и натиснете източника или sourcepage и знаете какво да направите. както казват някои, че от много информация, човек му втръсва. пак благодаря. честит празник на съединението на българия и се забавлявайте.
Активен

Naka

  • Напреднали
  • *****
  • Публикации: 3467
    • Профил
Re: Имам проблем с браузърите
« Отговор #12 -: Sep 06, 2011, 16:28 »
Цитат на: bop_bop_mara в Sep 06, 2011, 11:37
21 век сме, стига с това подреждане на базата на таблици. Таблиците са за таблични данни.  ;)

Да ама не... Таблиците са незаменини при подреждане на страници. Опитай се да направиш с DIV/css някоя по-сложна структура/по-сложно подравняване(таблици в таблица, цепене и обединяване на кутийки) и ще стане абсолютна каша.

Няколко пъти сам се пробвал с DIV/css, само нерви,усилия,време - и накрая нищо, най-много да заприлича на нещо но само с един браузер. Търкам всичко правя си го с таблици за 1 час, слагам им css на таблиците и готово. Навсякъде еднакво, става точно това което искаш, кодът разбирем! [_]3

То и затова още ги използват. А DIV елемента с css, според мен е нищо повече за пакетиране на поточен текстов блок - така както върви текста/параграфите в едно списание. Кой ли е измислил, че може да се използва и за подравняване ??? ??? ???


Колкото до това да се изобразява навсякъде еднакво - мисля че няма универсална рецепта. Трябва много добре да се разбират HTML таговете и CSS, да се използват по стандартни опции и всеки един случай да се разрешава индивидулано.

Като има някъде проблем почваш да четеш, намираш къде е проблема, теглиш една ........ на съответният браузер да ти олекне и продължаваш нататък.
« Последна редакция: Sep 06, 2011, 16:50 от Naka »
Активен
Perl - the only language that looks the same before and after encryption.

rumen6787

  • Гост
Re: Имам проблем с браузърите
« Отговор #13 -: Sep 09, 2011, 13:29 »
оправих таблиците със стилизиране в css с програмата Kompozer. Стана много интересно. дори не ми се наложи да пиша много css код, но все пак ги позиционираx от ляво с 60px и от дясно с 80 pxl - margin: 0 80 0 60px; padding: 0 auto.

* {margin: 0; padding: 0;}
body{background-color: #00cc00;}
tables{margin: 0 80px 0 60px; padding: 0 auto; border-collapse: collapse;table-layout: auto;}
tbody, th, td{background-color: rgb(4,93,197); font-family: Arial, Helvetica, sans-serif; font-size: 15pt; color: rgb(201,4,218); text-align: center; vertical-align: middle;}

можете сами да проверите.
« Последна редакция: Sep 09, 2011, 13:35 от rumen6787 »
Активен

PhrozenCrew

  • Напреднали
  • *****
  • Публикации: 51
    • Профил
Re: Имам проблем с браузърите
« Отговор #14 -: Sep 29, 2011, 19:02 »
За да се направи валидиран сайт по стандартите, без да се цапа с таблици и рязаници се иска опит и страниците да изглеждат еднакво във всички браузери. Дизайнер не се става за няколко дни.

Съвет към конкретния въпрос, който максимално да съкрати времето за дизайн:
1. Задължително, преди да започнеш с дизайна, нулирай стиловете за различните браузери. Можеш да потърсиш в google с критерий "css reset style" или нещо от сорта. Всеки дизайнер използва собствен файл с нулиращи инструкции.

2. Направи си CSS-framework за конкретния проект, в който да очертаеш предварително мрежата от полета, които може да ти се наложи да ползваш. Можеш да ползваш и чужд framework, но ще трябва да отделиш известно време за разучаването. Между другото повечето фраймуъркс вървят с комплект нулиращи стилове, така че могат да се използват и за обучение. Този не е лош - http://960.gs/ , но по-добре да си напишеш собствен.
Активен