Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,037

HOME > PHP > PHP Forum > สอบถามปัญหาด้าน CSS ใน DW กับ Browser แสดงผลไม่ตรงกันครับ



 

สอบถามปัญหาด้าน CSS ใน DW กับ Browser แสดงผลไม่ตรงกันครับ

 



Topic : 116964



โพสกระทู้ ( 18 )
บทความ ( 0 )



สถานะออฟไลน์




ผมเพิ่งฝึกหัดเขียน CSS ใหม่ๆ
กำลังจะครอบเว็บไซต์ ตอนนี้ติดปัญหาอยู่ที่ว่า พอทำใน Dreamweawer มันเรียบร้อยดีครับ
ตามภาพ ทุกเมนูเรียงชิดติดกัน

เรียบร้อยดี

แต่พอมาแสดงผลกลับกลายเป็นแบบนี้ครับ

ok

ผมควรต้องแก้อย่างไรดีครับ
อันนี้เป็น Code html ปกตินะครับ

Code
<div class="dataArea container"> <div class="wrapItem clearfix"> <div class="row1"> <div class="mookheadslidebar1"> <div class="headslidebar"><img src="images/buttoncal (1).gif" width="266" height="56"></div> <div class="headslidebar2"><img src="images/slidebar_3.gif" width="266" height="35"></div> <div class="headslidebar3"><img src="images/slidebar_1.gif" width="266" height="32"></div> <div class="headslidebar4"><img src="images/slidebar_2.gif" width="266" height="31"></div> <div class="headslidebar5"><img src="images/slidebar_7.gif" width="266" height="33"></div> <div class="headslidebar6"><img src="images/slidebar_6.gif" width="266" height="34"></div> <div class="headslidebar7">d</div> <div class="headslidebar8">ddd</div> <div class="headslidebar9"><img src="images/buttoncal (2).gif" width="266" height="54"></div> <div class="headslidebar10">calender</div> </div> </div>


อันนี้เป็น Code Css ครับ

Code
@charset "utf-8"; /* CSS Document */ /*library*/ .clearfix:after{ display:table; content:" "; clear:both } .container{ width: 901px; margin: 0 auto; background-image: 0; background-color: #FFF; } .fL{ float:left; } .fR{ float:right; } .w25per{ width:25%; } .headerwdhg{ width: 901px; height: 255px; background-image: url(../images/header.gif); } .button{ height: 42px; background-image: url(../images/menu_content.gif); } /*Project*/ body{ margin:0 } .row1{ width:266px; height:635px; margin:0; float:left; background:#eee; } .row2{ width:635px; float:left; background:while; } .row3{ width:635px; background:while; } .social4{ width:635px; } .header{ border:1px; } .content{ border:1px solid red; } .menu1{ width: 162px; float: left; background-image: url(../images/menu_home.gif); } .menu2{ width: 202px; float: left; background-color: #FFF; background-image: url(../images/menu_curriculum.gif); } .menu3{ width: 178px; float: left; background-image: url(../images/menu_webboard.gif); } .menu4{ width: 175px; float: left; background-image: url(../images/menu_media.gif); } .footer{ width: 901px; height: 139px; margin-right: auto; margin-left: auto; margin: 0 auto; clear: both; background-image: url(../images/footer.gif); text-align: center; font-family: "MS Sans Serif"; font-size: 12px; } .slidebarleft{ width: 266; height: 56; margin-right: auto; margin-left: auto; margin: 0 auto; }




Tag : HTML/CSS







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2015-06-06 00:04:49 By : topspin View : 954 Reply : 5
 

 

No. 1



โพสกระทู้ ( 1,458 )
บทความ ( 0 )



สถานะออฟไลน์
Twitter Facebook Blogger

เอกลักษณ์ของ Dreamweaver เป็นมาตั้งแต่มีคู่แข่งอย่าง FrontPage เมื่อ 20 ปีที่แล้ว
จุดขายของ DW คือ User Friendly แต่การ generate โค้ดยังมี bug มาจนถึงทุกวันนี้
เพราะฉะนั้น DW เหมาะสำหรับการออบแบบโครงร่างของหน้าตา ส่วนรายละเอียดยังต้องอาศัย
ความรู้ในการ edit code เอง (ผมมองว่า DW เหมาะกับมืออาชีพมากกว่า มือสมัครเล่น)
สมัยนั้น หลายๆ คนจึงตั้งฉายาให้มันว่า .."ติ๊งต๊อง"... ดีนะที่คุณยังเจอแค่การจัดเลย์เอาต์
ที่ผมเคยเจอคือ color เพี้ยน มีที่ไหน กำหนดน้ำเงิน แต่ออกแดง


ส่วนการแก้ปัญหาเบื้องต้น กำหนด margin ให้กับ image menu

CSS
.row1 div img { margin-bottom: 2px; }









ประวัติการแก้ไข
2020-06-04 12:57:59
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2020-06-04 12:57:13 By : PhrayaDev
 


 

No. 2



โพสกระทู้ ( 4,756 )
บทความ ( 8 )



สถานะออฟไลน์


ปกติมันไม่ควรเอารูปแบบที่เห็นใน WYSIWYG editor มาเป็นตัวอ้างอิงอะไรใดๆทั้งสิ้นนะครับ ถ้าไปอ้างอิงจากมันนี่คือผิดแล้ว
คุณต้องดูผลจากการแสดงบนเบราว์เซอร์จริงๆเป็นหลัก ไม่ใช่ใน DW.

และอย่างที่คห. 1 บอก DW มันยังมีปัญหาอื่นๆอีกมาก ที่ผมเคยใช้และก็เจอมาจนแบบว่าถ้าให้ไปใช้อีกก็ขอสบถว่า "กูไม่เอาแล้ว"
อย่างกระทู้หนึ่งเคยมาตั้งว่าเขียนแค่แท็กเปิดกับปิด script ก็ดันมีแจ้งเตือนว่าผิดพลาด อันนั้นเป็นอีกตัวอย่าง https://www.thaicreate.com/php/forum/135272.html

แนะนำให้ดูจากเบราว์เซอร์จริง หลายๆตัวด้วย เช่น Firefox, Chrome, Edge ที่มันเป็น Major browser คนใช้เยอะๆ. ส่วน Safari เราไม่มีเครื่องแม็คก็ช่างหัวมันละกัน ว่างั้นแหละ
แล้วก็ถ้าจะเปลี่ยน Editor ก็ลองดูตัวอื่นๆหลายตัว เลือกใช้ตามความถนัด อย่างเช่น Netbeans, Visual Studio Code, Notepad++, Sublime Text Editor, Komodo editor พวกนี้ฟรี
https://rundiz.com/?p=344


ประวัติการแก้ไข
2020-06-04 15:34:35
2020-06-04 15:35:04
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2020-06-04 15:33:38 By : mr.v
 

 

No. 3



โพสกระทู้ ( 4,169 )
บทความ ( 7 )

Hall of Fame 2012

สถานะออฟไลน์


ตอนนี้เค้าไปทางถูกแล้วล่ะครับกับ Adobe Cloud All Apps
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2020-06-04 17:39:59 By : Genesis™
 


 

No. 4



โพสกระทู้ ( 9,586 )
บทความ ( 2 )



สถานะออฟไลน์


ตอบความคิดเห็นที่ : 3 เขียนโดย : Genesis™ เมื่อวันที่ 2020-06-04 17:39:59
รายละเอียดของการตอบ ::
ทางถูกหรือทางเสียเงิน


เลือกตาม คห 2 ครับ ฟรีทั้งนั้น

สำหรับผมผมชอบ netbean 11 มีทั้ง version linux และ window (อันอื่นไม่รู้นะครับ)

สำหรับเจ้าของกระทู้ อย่าใช้ add-in browser ในการทดสอบงานครับ
ให้เลือกใช้ browser มาตรฐานในการทดสอบครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2020-06-04 19:42:24 By : Chaidhanan
 


 

No. 5



โพสกระทู้ ( 4,169 )
บทความ ( 7 )

Hall of Fame 2012

สถานะออฟไลน์


ตอบความคิดเห็นที่ : 4 เขียนโดย : Chaidhanan เมื่อวันที่ 2020-06-04 19:42:24
รายละเอียดของการตอบ ::
Corporate 1 Licenses โดนไป 32,000 ผมจะร้อง

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2020-06-04 22:41:27 By : Genesis™
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : สอบถามปัญหาด้าน CSS ใน DW กับ Browser แสดงผลไม่ตรงกันครับ
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 05
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่