הוסטס - פורום אחסון האתרים הגדול בישראל

הוסטס - פורום אחסון האתרים הגדול בישראל (https://hosts.co.il/forums/index.php)
-   פורום תיכנות (https://hosts.co.il/forums/forumdisplay.php?f=14)
-   -   HTML | בעיה שאני לא מצליח לסדר (https://hosts.co.il/forums/showthread.php?t=81554)

Proviewz 09-03-10 01:16
HTML | בעיה שאני לא מצליח לסדר
 
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
ציטוט:
נכתב במקור על ידי יניב בן צבי (פרסם 757885)
יכול להיות שהגובה של התמונה קטן מ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 (פרסם 757920)
נסה להוסיף 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
ציטוט:
נכתב במקור על ידי יניב בן צבי (פרסם 757962)
תשנה את ה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..

Shay Ben Moshe 09-03-10 23:06
padding מגדיל גם את הגודל של האלמנט.
משמע אם עשית padding-top:50px; וheight:100px; אז הגובה של האלמנט יהיה 150px והטקסט יתחיל רק אחרי 50px.

ככה זה

shushu 18-03-10 09:14
ציטוט:
נכתב במקור על ידי CrazyLioNeT (פרסם 757990)
אם הבנתי נכון אתה רוצה להרחיק טקסט? אז משתמש ב- margin בכלל.. במקום padding..
צודק, Padding גורם ל-DIV לגדול ולכן זה גורם לבעיה שהוצגה,
אם תשמתש ב-margin זה נטו ירחיק מלמעלה ובלי להגדיל את ה-DIV.


כל הזמנים הם GMT +2. הזמן כעת הוא 08:43.

מופעל באמצעות VBulletin גרסה 3.8.6
כל הזכויות שמורות ©
כל הזכויות שמורות לסולל יבוא ורשתות (1997) בע"מ