Skocz do zawartości

Kłopoty z pozycją diva z różnymi fontami

papieros

Przez papieros
w HTML i CSS

Rekomendowane odpowiedzi

papieros Newbie

papieros

Opublikowano
Opublikowano

Mam prosty plik stylu:

.cw, .cg,.cgs,.cws {

width:45;

width-max:45;

height:45;

border:1 solid black;

background:white;

display:inline;

margin:0;

padding:0;

align:center;

vertical-align:center;

font-size:200%;

font-weight:bold;

font-family:tahoma;

position:satatic;

}

.cgs,.cws {

font-size:70%;

}

divy mają być wyświetlane w 'szachownicy' 9x9 i wszystkop jest ok

dopopki jedno z pol nie ma mniejszego fontu (class=cgs)

zobaczcie to tu :

https://www.friko.net/sudoku/printtest/index.html

(pierwsze pole przesuniete do góry)

jak to zwalczyc? ma ktos jakis pomysl?

Z góry dzięki

P.

PS . Efekt występuje pod IE , pod innymi nie sprawdzalem

Odnośnik do komentarza
Udostępnij na innych stronach
lipa Newbie

lipa

Opublikowano
Opublikowano

index.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>SUDOKU ONLINE SOLVER on friko.net</title>
<LINK rel="stylesheet" type="text/css" href="print.css" />
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en" />
<meta name="description" content="SUDOKU ONLINE SOLVER allows to generate random, to solve given or ganerated SUDOKU, as well as to support solution" />
<meta name="keywords" content="sudoku,puzzle,online games,crosswords,numbers,puzzles" />
</head>

<body>
<div id="wrapper">
<div class="cgs">1</div><div class="cg">1</div><div class="cg">1</div>
<div class="cw">1</div><div class="cw">1</div><div class="cw">1</div>
<div class="cg">1</div><div class="cg">1</div><div class="cg">1</div>
<div class="cg">2</div><div class="cg">2</div><div class="cg"></div>
<div class="cw">1</div><div class="cw">1</div><div class="cw"></div>
<div class="cg">1</div><div class="cg">1</div><div class="cg"></div>
<div class="cg">1</div><div class="cg">2</div><div class="cg">1</div>
<div class="cw">1</div><div class="cw"></div><div class="cw">1</div>
<div class="cg">1</div><div class="cg">1</div><div class="cg">1</div>

<div class="cw">1</div><div class="cw">1</div><div class="cw">1</div>
<div class="cg">1</div><div class="cg">1</div><div class="cg">2</div>
<div class="cw">1</div><div class="cw">1</div><div class="cw">1</div>
<div class="cw">1</div><div class="cw">1</div><div class="cw">1</div>
<div class="cg">1</div><div class="cg">1</div><div class="cg">1</div>
<div class="cw">1</div><div class="cw">1</div><div class="cw">1</div>
<div class="cw">1</div><div class="cw">1</div><div class="cw">1</div>
<div class="cg">1</div><div class="cg">1</div><div class="cg">1</div>
<div class="cw">1</div><div class="cw">1</div><div class="cw">1</div>

<div class="cg">1 </div><div class="cg">1</div><div class="cg">1</div>
<div class="cw">1</div><div class="cw">1</div><div class="cw">1</div>
<div class="cg">1</div><div class="cg">1</div><div class="cg">1</div>
<div class="cg">2</div><div class="cg">2</div><div class="cg"></div>
<div class="cw">1</div><div class="cw">1</div><div class="cw"></div>
<div class="cg">1</div><div class="cg">1</div><div class="cg"></div>
<div class="cg">1</div><div class="cg">2</div><div class="cg">1</div>
<div class="cw">1</div><div class="cw"></div><div class="cw">1</div>
<div class="cg">1</div><div class="cg">1</div><div class="cg">1</div>
</div>
</body>

print.css:

#wrapper {
font-size: 20pt;
background: #000;
width: 423px;
position: relative;
margin: auto;
}

.cw, .cg, .cgs, .cws {
width: 45px;
height: 45px;
border: 1px solid #000;
text-align: center;
line-height: 45px;
vertical-align: middle;
font-size: 100%;
font-weight: bold;
font-family: tahoma;
float: left;
position: relative;
}

.cw, .cws {
background: #fff;
}

.cg, .cgs { 
background: #eee;
}

.cgs, .cws {
font-size: 70%;
}

Proszę bardzo! :excl: Wyświetla się poprawnie w IE i FF. Zamiast 'display: inline' użyłem 'float: left', ustawiłem doctype na xhtml 1.0 transitional i poprawiłem inne błędy. Jak masz jakieś pytania, wal śmiało.

Nieruchomości Poznań | lipny.pl | Developer Poznań

Odnośnik do komentarza
Udostępnij na innych stronach

Zarchiwizowany

Ten temat przebywa obecnie w archiwum. Dodawanie nowych odpowiedzi zostało zablokowane.

Tematy

  • Ostatnio przeglądający   0 użytkowników

    • Brak zarejestrowanych użytkowników przeglądających tę stronę.
×
×
  • Dodaj nową pozycję...

Powiadomienie o plikach cookie

Umieściliśmy na Twoim urządzeniu pliki cookie, aby pomóc Ci usprawnić przeglądanie strony. Możesz dostosować ustawienia plików cookie, w przeciwnym wypadku zakładamy, że wyrażasz na to zgodę. Warunki użytkowania Polityka prywatności