OLD | NEW |
1 <?xml version="1.0" encoding="UTF-8"?> | 1 <?xml version="1.0" encoding="UTF-8"?> |
2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN" "http://www.w3.org/TR/xh
tml-basic/xhtml-basic11.dtd"> | 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN" "http://www.w3.org/TR/xh
tml-basic/xhtml-basic11.dtd"> |
3 <html xmlns="http://www.w3.org/1999/xhtml"> | 3 <html xmlns="http://www.w3.org/1999/xhtml"> |
4 <head> | 4 <head> |
5 <title>WICD Core 1.0 #20-3 - SVG grid with percentage width</title> | 5 <title>WICD Core 1.0 #20-3 - SVG grid with percentage width</title> |
6 <style type="text/css"> | 6 <style type="text/css"> |
7 div,object | 7 div,object |
8 {float:left;} | 8 {float:left;} |
9 .full | 9 .full |
10 {width:100%;} | 10 {width:100%;} |
(...skipping 37 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
48 You should be able to resize your browser window and the grid rendering shou
ld adjust to it. The outcome should look like in these sample screenshots: | 48 You should be able to resize your browser window and the grid rendering shou
ld adjust to it. The outcome should look like in these sample screenshots: |
49 <a href="rightsizing1.png">small</a>, <a href="rightsizing2.png">bigger</a>
and <a href="rightsizing3.png">big</a>. | 49 <a href="rightsizing1.png">small</a>, <a href="rightsizing2.png">bigger</a>
and <a href="rightsizing3.png">big</a>. |
50 </p> | 50 </p> |
51 <p> | 51 <p> |
52 The test is successful, if all SVG elements resize exacly dependend on the w
idth of the browser window, but keep their aspect ratio and relative position. T
he complete grid should always show a perfect rectangle object. | 52 The test is successful, if all SVG elements resize exacly dependend on the w
idth of the browser window, but keep their aspect ratio and relative position. T
he complete grid should always show a perfect rectangle object. |
53 </p> | 53 </p> |
54 <p><br/><a href="javascript:history.back()">Back</a></p> | 54 <p><br/><a href="javascript:history.back()">Back</a></p> |
55 </div> | 55 </div> |
56 </body> | 56 </body> |
57 </html> | 57 </html> |
OLD | NEW |