Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [css] obramowanie obrazka
poxrimex
post 25.01.2008, 14:57:35
Post #1





Grupa: Zarejestrowani
Postów: 368
Pomógł: 2
Dołączył: 23.09.2007

Ostrzeżenie: (60%)
XXX--


Witam!

w css jak mam diva logo, którego wysokość jest 100 px i kolor tła czarny. W tego diva wstawiam obrazek również o wysokości 100px, a wtedy sam div rozszerza mi się mniejwięcej do 105px, lecz tylko w przeglądarce IE. Jak to zlikwidować?


--------------------



Go to the top of the page
+Quote Post
b_chmura
post 25.01.2008, 15:01:35
Post #2





Grupa: Zarejestrowani
Postów: 813
Pomógł: 34
Dołączył: 18.03.2007
Skąd: o stamtąd

Ostrzeżenie: (0%)
-----


Kod
img
{
  border: 0px;
}
Go to the top of the page
+Quote Post
poxrimex
post 25.01.2008, 15:03:02
Post #3





Grupa: Zarejestrowani
Postów: 368
Pomógł: 2
Dołączył: 23.09.2007

Ostrzeżenie: (60%)
XXX--


niestety nic to nie pomogło sadsmiley02.gif


--------------------



Go to the top of the page
+Quote Post
phpion
post 25.01.2008, 15:03:22
Post #4





Grupa: Moderatorzy
Postów: 6 072
Pomógł: 861
Dołączył: 10.12.2003
Skąd: Dąbrowa Górnicza




Dla tego obrazka w divie ustaw styl:
  1. display: block; margin: 0px;

a dla samego diva dla pewności jeszcze:
  1. padding: 0px;

Powinno pomóc.
Go to the top of the page
+Quote Post
b_chmura
post 25.01.2008, 15:04:25
Post #5





Grupa: Zarejestrowani
Postów: 813
Pomógł: 34
Dołączył: 18.03.2007
Skąd: o stamtąd

Ostrzeżenie: (0%)
-----


div nie ma czasem marginesów poustawianych lub paddingu?
Go to the top of the page
+Quote Post
poxrimex
post 25.01.2008, 15:10:23
Post #6





Grupa: Zarejestrowani
Postów: 368
Pomógł: 2
Dołączył: 23.09.2007

Ostrzeżenie: (60%)
XXX--


Hehe nadal ni **** nie działa, oto kody:

Strona.css (style):
  1. html, body
  2. {
  3. margin-top: 0px;
  4. margin-left: 0px;
  5. margin-right: 0px;
  6. margin-bottom: 0px;
  7. }
  8.  
  9. #strona
  10. {
  11. width: 900px;
  12. margin-left: auto;
  13. margin-right: auto;
  14. float: center;
  15. }
  16.  
  17. #logo
  18. {
  19. width: 900px;
  20. text-align: center;
  21. clear: both;
  22. margin-left: auto;
  23. margin-right: auto;
  24. background-color: black;
  25. float: center;
  26. }


a to html:

  1.  
  2. <!-- Początek Atrybutów Head --!>
  3. <head>
  4. <link rel="Stylesheet" type="text/css" href="strona.css" />
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  6. <meta name="language" content="pl" />
  7. </head>
  8. <!-- Koniec Atrybutów Head --!>
  9.  
  10. </body>
  11. <!-- Deklaracja divu strona --!>
  12. <div id="site">
  13.  
  14. <div id="logo">
  15. <img src="logo.gif" style="width: 360px; height: 100px;"/>
  16.  
  17.  
  18. </div>
  19.  
  20. </div>
  21. <!-- Div zamykający strona --!>
  22.  
  23.  
  24.  
  25.  
  26.  
  27.  
  28. </body>
  29.  
  30. </html>


Dodam, że tak się dzieje tylko w IE i w IE nie działają mi marginesy do tych divów


--------------------



Go to the top of the page
+Quote Post
pijanyadmin
post 25.01.2008, 15:12:06
Post #7





Grupa: Zarejestrowani
Postów: 128
Pomógł: 1
Dołączył: 24.10.2007

Ostrzeżenie: (0%)
-----


sprawdziłem to przed chwilą i działa bez problemu, jak dodajesz ten obrazek?

Kod
IMG {border: 0px;}


dla

Kod
<img src="img/logo.png" alt="logo" />


nie pisz tego w css jako

Kod
#IMG {border: 0px;}


czy

Kod
.IMG {border: 0px;}
Go to the top of the page
+Quote Post
poxrimex
post 25.01.2008, 15:14:29
Post #8





Grupa: Zarejestrowani
Postów: 368
Pomógł: 2
Dołączył: 23.09.2007

Ostrzeżenie: (60%)
XXX--


No mi nadal nie działa.

Przypominam! Tylko pod Internet Explorer


--------------------



Go to the top of the page
+Quote Post
pijanyadmin
post 25.01.2008, 15:18:15
Post #9





Grupa: Zarejestrowani
Postów: 128
Pomógł: 1
Dołączył: 24.10.2007

Ostrzeżenie: (0%)
-----


css:
Kod
html, body
{
margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: 0px;
}

#strona
{
width: 900px;
margin-left: auto;
margin-right: auto;
float: center;
}

#logo
{
width: 900px;
text-align: center;
clear: both;
margin-left: auto;
margin-right: auto;
background-color: black;
float: center;
}

IMG {border: 0px;}


napewno tak dodałeś?
Go to the top of the page
+Quote Post
poxrimex
post 25.01.2008, 15:20:57
Post #10





Grupa: Zarejestrowani
Postów: 368
Pomógł: 2
Dołączył: 23.09.2007

Ostrzeżenie: (60%)
XXX--


tak samo ;/


--------------------



Go to the top of the page
+Quote Post
mike
post 25.01.2008, 15:22:27
Post #11





Grupa: Przyjaciele php.pl
Postów: 7 494
Pomógł: 302
Dołączył: 31.03.2004

Ostrzeżenie: (0%)
-----


Cytat(poxrimex @ 25.01.2008, 15:14:29 ) *
Przypominam! Tylko pod Internet Explorer
Kolejny popularny bug badzIEwia.
Nie tak:
  1. <div id="logo">
  2. <img src="logo.gif" style="width: 360px; height: 100px;"/>
  3.  
  4.  
  5. </div>
tylko tak:
  1. <div id="logo"><img src="logo.gif" style="width: 360px; height: 100px;"/></div>
smile.gif
Go to the top of the page
+Quote Post
poxrimex
post 25.01.2008, 15:27:30
Post #12





Grupa: Zarejestrowani
Postów: 368
Pomógł: 2
Dołączył: 23.09.2007

Ostrzeżenie: (60%)
XXX--


 Mike smile.gif Twój post mi pomógł biggrin.gif

Faktycznie badziewie IE szkoda że użytkownicy są tacy głupi i z tego korzystają ...

Teraz mam problem, gdyż nie mogę tych divów wyśrodkować, oczywiście w IE

Ten post edytował poxrimex 25.01.2008, 15:25:47


--------------------



Go to the top of the page
+Quote Post
pijanyadmin
post 25.01.2008, 15:30:09
Post #13





Grupa: Zarejestrowani
Postów: 128
Pomógł: 1
Dołączył: 24.10.2007

Ostrzeżenie: (0%)
-----


emm bug? e gadacie, lepiej byłoby logo zrboić osobno w css, po co dodajesz do img

Kod
style="width: 360px; height: 100px;"


Kod
<div id="czarnepole">
   <div id="logo></div>
</div>
Go to the top of the page
+Quote Post
poxrimex
post 25.01.2008, 15:31:43
Post #14





Grupa: Zarejestrowani
Postów: 368
Pomógł: 2
Dołączył: 23.09.2007

Ostrzeżenie: (60%)
XXX--


dobra ta sprawa rozwiązana.

Przy divie gdzie tylko logo jest to mogę to stosować mi to nie przeszkadza. Teraz mi chodzi o to jak wyśrodkować te divy w IE


--------------------



Go to the top of the page
+Quote Post
b_chmura
post 25.01.2008, 15:48:10
Post #15





Grupa: Zarejestrowani
Postów: 813
Pomógł: 34
Dołączył: 18.03.2007
Skąd: o stamtąd

Ostrzeżenie: (0%)
-----


potrzebne Ci będą dwa divy
Kod
<div id="center">
  <div id="tekst">wycentrowany div</div>
</div>


i style
Kod
#center
{
  text-align: center;
  width: 200px;
  height: 200px;
}
#tekst
{
  margin: 0 auto;
  width: 100px;
  height: 100px;
}
Go to the top of the page
+Quote Post
pijanyadmin
post 25.01.2008, 15:55:43
Post #16





Grupa: Zarejestrowani
Postów: 128
Pomógł: 1
Dołączył: 24.10.2007

Ostrzeżenie: (0%)
-----


albo jeśli xhtml to w css

Kod
#logo{
margin-left: auto;
margin-right: auto;
background-image: url(logo.gif);
background-repeat:no-repeat;
width: 360px;
height: 100px;
}


za wyśrodkowanie danego elementu odpowaidają:

Kod
margin-left: auto;
margin-right: auto;


natomiast
Kod
text-align:center;
odpowiada tylko za wyśrodkowanie tekstu w div

Ten post edytował pijanyadmin 25.01.2008, 15:56:07
Go to the top of the page
+Quote Post
poxrimex
post 25.01.2008, 16:02:44
Post #17





Grupa: Zarejestrowani
Postów: 368
Pomógł: 2
Dołączył: 23.09.2007

Ostrzeżenie: (60%)
XXX--


no tak niby
auto
auto
odpowiadają za wyśrodkowanie elementu wszystko ok, ale nie w IE sadsmiley02.gif


--------------------



Go to the top of the page
+Quote Post
potreb
post 25.01.2008, 16:04:21
Post #18





Grupa: Zarejestrowani
Postów: 1 568
Pomógł: 192
Dołączył: 7.03.2005
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


Daj w body:
text-align: center;

A w divie text-align: left; margin: 0 auto;

Niestety IE to łopatologia 2 rzędu

Ten post edytował potreb 25.01.2008, 16:05:51


--------------------

Go to the top of the page
+Quote Post
pijanyadmin
post 25.01.2008, 16:27:39
Post #19





Grupa: Zarejestrowani
Postów: 128
Pomógł: 1
Dołączył: 24.10.2007

Ostrzeżenie: (0%)
-----


obstawiam że Twoje problemy z IE znikną jeśli napiszesz to odpowiednio jako xhtml i dodasz doctype:

Kod
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        <title>costam na belce tytulowej</title>
        <link rel="stylesheet" href="style.css" type="text/css" />
    </head>


wtedy zadziała to co Ci napisałem wcześniej
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 18.07.2025 - 05:44