HTML | בעיה שאני לא מצליח לסדר - הוסטס

Proviewz · 09-03-10, 01:16

HTML קוד:

background-image: url(images/header_line_bg.jpg);
padding-top: 15px;
height: 160px;

זה הcss שנתתי לdiv עכשיו במקום פשוט שהטקסט יתרחק 15 פיקסלים מהחלק העליון זה יורד 15 פיקסלים אבל גם מוסיף 15 פיקסלים נוספים למטה לכל הdiv, למה זה? ואיך אני פותר את זה?

תודה מראש

יניב בן צבי · 09-03-10, 01:24

יכול להיות שהגובה של התמונה קטן מ160px

Proviewz · 09-03-10, 01:44

ציטוט:

נכתב במקור על ידי יניב בן צבי

יכול להיות שהגובה של התמונה קטן מ160px

הגובה של התמונה 160 פיקסלים בדיוק, לפני שאני מוסיף את הpadding-top הdiv נראה בסדר גמור אבל אחרי שאני מוסיף זה גדל בעוד 15 פיקסלים.

יניב בן צבי · 09-03-10, 02:07

אתה יכול לשלוח לי קישור?

**IgalSt** · 09-03-10, 12:55

נסה להוסיף overflow:hidden

Proviewz · 09-03-10, 14:14

ציטוט:

נכתב במקור על ידי Exa.co.il

נסה להוסיף overflow:hidden

לא עזר,
http://pvz.co.il/problem

HTML:

HTML קוד:

<!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" /> 
  <title></title> 
  <link rel="stylesheet" type="text/css" href="stylesheet.css" media="screen" /> 
</head> 
 
<body id="home-page"> 
<div id="wrapper"> 
    <div id="header-wrapper"> 
        <div id="header-line">Hello World</div> 
    </div> 
</div> 
</body> 
 
</html>

CSS:

HTML קוד:

body {
	margin:0 auto;
	font-family: Arial;
	font-size: 12px;
	background:#e2e2e2;
	color:#ffffff;
	text-align:left;
}
#wrapper {
  margin: 0 auto;
  padding: 0px;
  width: 100%;
}
#header-wrapper {
  margin: 0 auto;
  padding: 0px;
  width: 100%;
}

#header-line {
  background-image: url(images/header_line_bg.jpg);
  padding-top: 15px;
  height: 45px;
}

יניב בן צבי · 09-03-10, 19:04

תשנה את הCSS לזה...

HTML קוד:

body {
	margin:0 auto;
	font-family: Arial;
	font-size: 12px;
	background:#e2e2e2;
	color:#ffffff;
	text-align:left;
}
#wrapper {
  margin: 0 auto;
  padding: 0px;
  width: 100%;
  height: 45px;
}
#header-wrapper {
  margin: 0 auto;
  padding: 0px;
  width: 100%;
  height: 45px;
}

#header-line {
  background-image: url(header_line_bg.jpg);padding: 0px 0px 0px 0px;
  background-repeat:repeat-x;
  padding-top: 15px;
  height: 45px;
}

Proviewz · 09-03-10, 19:09

ציטוט:

נכתב במקור על ידי יניב בן צבי

תשנה את הCSS לזה...

HTML קוד:

body {
	margin:0 auto;
	font-family: Arial;
	font-size: 12px;
	background:#e2e2e2;
	color:#ffffff;
	text-align:left;
}
#wrapper {
  margin: 0 auto;
  padding: 0px;
  width: 100%;
  height: 45px;
}
#header-wrapper {
  margin: 0 auto;
  padding: 0px;
  width: 100%;
  height: 45px;
}

#header-line {
  background-image: url(header_line_bg.jpg);padding: 0px 0px 0px 0px;
  background-repeat:repeat-x;
  padding-top: 15px;
  height: 45px;
}

למה הגבלת את הגובה של הwrapperים ל45 פיקסלים? אלה המעטפות שצריכות לעטוף את כל העיצוב הן לא יכולות להיות רק 45 פיקסלים

yNaxon · 09-03-10, 19:32

אבירן,
padding אתה שם באלמנט משלו.
כלומר, אם שם הdiv הוא aviran, אתה עושה ככה:

קוד:

background-image: url(images/header_line_bg.jpg);
height: 160px;

ואז:
.aviran .wrap
{
padding:15px 0 0 0;
}
ובתוך הdiv aviran מוסיף div <div class="wrap">

CrazyLioNeT · 09-03-10, 21:58

אם הבנתי נכון אתה רוצה להרחיק טקסט? אז משתמש ב- margin בכלל.. במקום padding..

09-03-10, 01:16	# 1
Proviewz משתמש - היכל התהילה מיני פרופיל תאריך הצטרפות: Oct 2005 מיקום: בת-ים גיל: 33 הודעות: 2,222	HTML \| בעיה שאני לא מצליח לסדר HTML קוד: background-image: url(images/header_line_bg.jpg); padding-top: 15px; height: 160px; זה הcss שנתתי לdiv עכשיו במקום פשוט שהטקסט יתרחק 15 פיקסלים מהחלק העליון זה יורד 15 פיקסלים אבל גם מוסיף 15 פיקסלים נוספים למטה לכל הdiv, למה זה? ואיך אני פותר את זה? תודה מראש

09-03-10, 12:55	# 5
IgalSt מנהל פורום, עסק רשום מיני פרופיל תאריך הצטרפות: Oct 2005 מיקום: המרכז גיל: 37 הודעות: 1,432	נסה להוסיף overflow:hidden __________________ יגאל סטקלוב Igal Steklov Slides מה השעה? טרקלין דן טרמינל 1

09-03-10, 19:32	# 9
yNaxon אקס מנהל מיני פרופיל תאריך הצטרפות: Dec 2005 מיקום: תל אביב הודעות: 7,481	אבירן, padding אתה שם באלמנט משלו. כלומר, אם שם הdiv הוא aviran, אתה עושה ככה: קוד: background-image: url(images/header_line_bg.jpg); height: 160px; ואז: .aviran .wrap { padding:15px 0 0 0; } ובתוך הdiv aviran מוסיף div <div class="wrap"> __________________ בברכה, יונתן.

09-03-10, 21:58	# 10
CrazyLioNeT חבר מתקדם מיני פרופיל תאריך הצטרפות: Oct 2005 מיקום: חדרה גיל: 32 הודעות: 354	אם הבנתי נכון אתה רוצה להרחיק טקסט? אז משתמש ב- margin בכלל.. במקום padding.. __________________


	ההרשמה לפורום נפתחה - אפשרות רישום לכל אימייל (דומיינים פרטיים, gmail, הוטמייל..)!

09-03-10, 01:24	# 2
יניב בן צבי חבר בקהילה מיני פרופיל תאריך הצטרפות: Nov 2007 הודעות: 162	יכול להיות שהגובה של התמונה קטן מ160px

09-03-10, 02:07	# 4
יניב בן צבי חבר בקהילה מיני פרופיל תאריך הצטרפות: Nov 2007 הודעות: 162	אתה יכול לשלוח לי קישור?

חברים פעילים הצופים באשכול זה: 1 (0 חברים ו- 1 אורחים)