Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,027

HOME > กระทู้สำหรับภาษาต่าง ๆ > แก้ไม่ตก เป็นอะไรไม่รู้บอกไม่ถูก ช่วยชีทางสว่างหน่อย

แก้ไม่ตก เป็นอะไรไม่รู้บอกไม่ถูก ช่วยชีทางสว่างหน่อย

เริ่มหัวข้อใหม่

DavidCopter

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

อยู่ดีๆมันก็ไปอยู้ตามภาพเฉยเลย ตอนผมทำมันยังอยู่ตรงกลางดีๆเลย
Code

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/main_style.css" />
<link rel="stylesheet" href="css/default-slide_style.css" type="text/css" media="screen" />
<title>.: YaakHitz :.</title>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript">
$(window).load(function() {$('#slider').nivoSlider({effect:'random'});});
</script>
</head>
<body>

<div id="header">
<div class="advertise"></div>
</div>

<div id="menutop">
<ul>
<li><span><a href="#">หน้าแรก</a></span></li>
<li><span><a href="#">ข่าว</a></span></li>
<li><span><a href="#">ฟังเพลง</a></span></li>
<li><span><a href="#">วาไรตี้</a></span></li>
<li><span><a href="#">เว็บบอร์ด</a></span></li>
<li><span><a href="#">ตลาด</a></span></li>
<li><span><a href="#">ความรู้</a></span></li>
<li><span><a href="#">กิจกรรม</a></span></li>
</ul>
</div>

<div id="notice">
<div class="inner"></div>
</div>

<div id="box">
<div class="box-l">
<div class="inner">
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<img src="images/slider1.jpg" alt="" title="#htmlcaption1"/>
<img src="images/slider2.jpg" alt="" title="#htmlcaption2" />
<img src="images/slider3.jpg" alt="" title="#htmlcaption3" />
<img src="images/slider4.jpg" alt="" title="#htmlcaption4" />
</div>
<div id="htmlcaption1" class="nivo-html-caption">
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
</div>
<div id="htmlcaption2" class="nivo-html-caption">
BBBBBBBBBBBBBBBBBBBBBBBBBBBBBB
</div>
<div id="htmlcaption3" class="nivo-html-caption">
CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC
</div>
<div id="htmlcaption4" class="nivo-html-caption">
DDDDDDDDDDDDDDDDDDDDDDDDDDDDDDDD
</div>
</div>

</div>
</div>
</div>
<div class="box-r">
<img src="images/advt/advt1_220x350.jpg" width="230" height="350" />
</div>
</div>
</body>
</html>

CSS

/* CSS Document */
body {
margin:0;
padding:0;
background:#EFEFEF;
font:Tahoma, Geneva, sans-serif;
float: right;
}

h1,h2,h3,h4,h5,h6 {margin:0; padding:0;}
img { border:0; }

/* Menu */
#menutop { width:1024px; height:35px; margin:10px auto 10px auto; padding:0; overflow:auto; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background:#71B9F4; }
#menutop ul { margin:0; padding:0; }
#menutop ul li { margin:0 5px 0 5px; width:auto; height:35px; float:left; display:block; list-style:none; color:#FFF; }

#menutop ul li span { margin:6px; padding:5px; line-height:15px; width:auto; display:block; text-align:center; }
#menutop ul li span:hover { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background:#FFF; }

#menutop ul li a { font:16px; color:#FFF; text-decoration:none;}
#menutop ul li a:hover { text-decoration:underline; color:#09F; }

/* Header */
#header { width:1024px; margin:auto; padding:0; height:130px; background:url(../images/logo_2.png) left center no-repeat;}
#header img { border:0; }
#header .advertise { width:700px; height:120px; margin:5px; float:right; }

/* Notice */
#notice { width:1024px; height:auto; margin:10px auto 10px auto; padding:0; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius:8px; border:dashed 1px #F90; background:#FAEAB8; }
#notice .inner { margin:5px; padding:2px; color:#00; font-size:18px; text-align:center; }

/* Box */
#box { width:1024px; height:auto; margin:auto; padding:0;}
#box .box-l { float:left; width:750px; height:auto; margin:5px; padding:0; -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px; background:#FFF;}
#box .box-l .inner { margin:10px; padding:0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
#box .box-l .news-hit { clear:both; height:300px; padding:5px; -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px; border:solid 1px #CCC;}
#box .box-r { float:right; width:230px; height:auto; margin:5px; padding:5px; }

Tag : HTML/CSS

Date : 2012-03-16 16:42:56

By : zoneme

View : 1000

Reply : 3

No. 1

TC Admin

โพสกระทู้ ( 74,058 )
บทความ ( 838 )

Quote:
float: right;

เกี่ยวกับตัวนี้หรือเปล่าครับ ผมเดาน่ะ เพราะผมไม่คล่อง CSS

Date : 2012-03-16 20:33:39

By : webmaster

No. 2

DavidCopter

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

ตอบความคิดเห็นที่ : 1 เขียนโดย : webmaster เมื่อวันที่ 2012-03-16 20:33:39

รายละเอียดของการตอบ ::

ไม่นะครับ ผมรู้สึกว่าผมไม่ได้ยุ่ง code เลย อยู่ดีๆก็เป็นเอง
♥ ละก็ดูใน IE ไม้เป็นอาครับ

ประวัติการแก้ไข
2012-03-16 20:55:57

Date : 2012-03-16 20:53:46

By : zoneme

No. 3

PlaKriM

โพสกระทู้ ( 11,835 )
บทความ ( 10 )

ควรจะมีตัวที่เป็น main contrainer กับตัวที่เป็น wrapper หาดูเว็บทั่วไปครับ เค้าจัดกันไม่ยาก

Date : 2012-03-17 02:24:42

By : ikikkok

ค้นหาข้อมูล

แสดงความคิดเห็น

Re : แก้ไม่ตก เป็นอะไรไม่รู้บอกไม่ถูก ช่วยชีทางสว่างหน่อย

รายละเอียด

เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

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

Notice

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

เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง

โดย

อีเมล์

บวกค่าให้ถูก

<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)

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

Load balance : Server 02