Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Obtinere gratuitati Legea 189/2000

La mulți ani @BlueKing-69!

suspectez un switch ca are probleme

Poate cineva sa imi indice de ce ...
 Votați-l pe Cap de Porc

Igienizare teren Bucuresti

Pompa submersibila-Pornire/Oprire

Streamer Logitech squeezebox duet
 Spatiile sanitare din Romania

Se poate seta mai jos de 1940 aici?

Canon EOS R1

Dimensionare corecta a tevilor/tr...
 System data 100GB din 256GB

Pot sa schimb routerul?

Taxa pod " Sold peaje neexpir...

Problema stabilizator tensiune cu...
 

DIV coboara pe urmatoarea linie la Zoom Out

- - - - -
  • Please log in to reply
7 replies to this topic

#1
geo86

geo86

    Junior Member

  • Grup: Members
  • Posts: 102
  • Înscris: 27.12.2006
Salut,

Am urmatorul cod:

HTML
<body>
<div id="page-wrap"><!--Start Wrapper -->
  <div id="container">
  <div class="post">
	<div class="entry">
	  Welcome to Daventry Dental SPA
	  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus tempus ornare viverra. Nullam sit amet eleifend diam. Donec ac eros risus. Quisque eget lectus sed augue ornare fringilla in nec tellus. Phasellus ut enim est. Morbi suscipit semper erat vel mattis. Nam suscipit ante eu elit tristique vitae lacinia nibh venenatis.
	  </div>
  </div>
  <!-- Start Right Sidebar -->
  <div id="sidebar">
	Text
	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus tempus ornare viverra. Nullam sit amet eleifend diam. Donec ac eros risus. Quisque eget lectus sed augue ornare fringilla in nec tellus. Phasellus ut enim est. Morbi suscipit semper erat vel mattis. Nam suscipit ante eu elit tristique vitae lacinia nibh venenatis
  </div>
  <!-- End Right Sidebar -->
  </div>
</div><!--end page wrap -->
</body>
</html>


CSS
* {
margin:0px;
padding:0px;
border:0px;
}
body {
background:url(images/bg_body.jpg) repeat-x #8E258A;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
#page-wrap {
width:960px;
margin: 10px auto;
position:relative;
}
#container {
background:#FFF;
width:920px;
padding: 0 20px;
float:left;
}
/****************** Post (left container) ******************/
.post {
width:630px;
float:left;
border-right:1px solid #E5E3E5;
padding-right:20px;
}
/****************** Right Sidebar ******************/
#sidebar {
width:269px;
float:right;
}


In Firefox/Chrome la zoom normal se vede ok. Problema este ca daca fac Zoom Out, sidebar-ul coboara pe linia urmatoare.
Dupa ore intregi pierdute am gasit din greseala o solutie. La div-ul Post, daca inlocuiesc
padding-right:20px;

cu
padding-right:20px solid #E5E3E5;

problema nu mai apare.

Acum, eu stiu ca padding nu are nimic de-a face cu solid si color.

Voi ce explicatie aveti ?

P.S. Am atasat doar fisierul CSS. Fisierul HTML nu este permis.

Merci,
George

Attached Files



#2
tracius01

tracius01

    Active Member

  • Grup: Members
  • Posts: 1,339
  • Înscris: 11.11.2007
mie nu-mi pare  problema asta.
o explicatie ar fi ca in urma relacularii dimensiunea divului browserul sa truncheze valoarea gresit.
ce placa video ai?

Edited by tracius01, 31 August 2012 - 00:16.


#3
geo86

geo86

    Junior Member

  • Grup: Members
  • Posts: 102
  • Înscris: 27.12.2006

View Posttracius01, on 31 august 2012 - 00:15, said:

mie nu-mi pare  problema asta.
o explicatie ar fi ca in urma relacularii dimensiunea divului browserul sa truncheze valoarea gresit.
ce placa video ai?

Am mai facut pagini in acest mod si nu am avut probleme pana acum. Singura diferenta este ca acelea erau Plain HTML si CSS iar aceasta este un template pentru Wordpress (in esenta tot un fisier CSS).
Nu cred ca are nicio legatura cu placa video si nici cu browserul.

Curios pentru mine este de ce nu merge cu padding-right:20px; dar merge cu padding-right:20px solid #E5E3E5; care nu este un atribut corect.
De ce trebuie sa specific "solid" si "#E5E3E5" pentru padding ca sa nu mai sara pe linia urmatoare ?

Mie mi se pare bug.

#4
tracius01

tracius01

    Active Member

  • Grup: Members
  • Posts: 1,339
  • Înscris: 11.11.2007
tu dai click drepta in browser sa inspectezi pagina?
ai dreptate cand spui ca padding-right:20px solid #E5E3E5; este invalid, prin urmare este ignorat de browser.

#5
geo86

geo86

    Junior Member

  • Grup: Members
  • Posts: 102
  • Înscris: 27.12.2006

View Posttracius01, on 31 august 2012 - 19:47, said:

tu dai click drepta in browser sa inspectezi pagina?
Nu inteleg intrebarea ta ?
Dau cand am nevoie sa vad codul sursa.

Accept ca este ignorat de browser dar totusi....care este explicatia ?
Este bine sa stim "De ce ?" ca sa nu mai facem aceleasi greseli in viitor.

#6
tracius01

tracius01

    Active Member

  • Grup: Members
  • Posts: 1,339
  • Înscris: 11.11.2007
ma repet spune-mi ce placa video si proc ai

#7
geo86

geo86

    Junior Member

  • Grup: Members
  • Posts: 102
  • Înscris: 27.12.2006

View Posttracius01, on 31 august 2012 - 20:19, said:

ma repet spune-mi ce placa video si proc ai

Procesor: Intel Core i5-2410M CPU @ 2.3GHz 2.3GHz
Placa video: RADEON HD 6490M

#8
geo86

geo86

    Junior Member

  • Grup: Members
  • Posts: 102
  • Înscris: 27.12.2006
Am gasit buba dar numai jumatate.

De vina este border:1px. Cand fac Zoom Out, borderul ar trebui sa se micsoreze si el insa display-ul nu poate sa il afiseze doar pe jumatate de pixel sau pe 2 treimi de pixel. Astfel ca il afiseaza pe 1px la orice nivel de zoom. Asta face ca latimea toatala a div-ului sa fie mai mare decat ar trebui si nu mai are loc in wrapper/container.
Am pus border 3 pixeli si pot sa merg cu Zoom Out pana la o valoare mai mare. Daca pun 4px. nu mai am probleme la Zoom Out.

Dar tot nu imi este clar de ce acest defect se corecteaza cu padding-right:20px solid #E5E3E5;
Acest atribut nu are o forma corecta si rezulta un cod CSS invalid.

Anunturi

Neurochirurgie minim invazivă Neurochirurgie minim invazivă

"Primum non nocere" este ideea ce a deschis drumul medicinei spre minim invaziv.

Avansul tehnologic extraordinar din ultimele decenii a permis dezvoltarea tuturor domeniilor medicinei. Microscopul operator, neuronavigația, tehnicile anestezice avansate permit intervenții chirurgicale tot mai precise, tot mai sigure. Neurochirurgia minim invazivă, sau prin "gaura cheii", oferă pacienților posibilitatea de a se opera cu riscuri minime, fie ele neurologice, infecțioase, medicale sau estetice.

www.neurohope.ro

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate