Deal Plazza - responsive layout problems
- Posted by Yilmaz (45) Offline
Greatings from germany,
i got a problem with the responsive layout of the template "Deal Plazza"
If i create a table whit pics inside, the pics and the hole table are not responsive, they stay always in the same size.
I do not need a table if it is not work whit tables, my point is to set 5 pics in various positions. It shoud just stay that way like one pic, it shoud not jump around on different resolutions.
My resolution is full hd, and there it looks ok. but every other resolution its jumps out of the window.
You can visit my site to have a look at it, its direkt on the frontpage, you wont miss it!
www.yeslimited.de/customers/dealsbook/
I woud be happy if someone can help me whit that.
Thats the code for the table:
<table class="size-auto" style="table-layout: auto;" width="988" border="0">
<tbody>
<tr>
<td><a href="index.php/topdeals/item/5-one-nights-stay-in-krown-hotel-for-$35-value-$70" target="_self"><img class="size-auto" src="images/stories/top_test/1.jpg" border="0" width="350" height="180" style="border: 0;" /></a></td>
<td style="text-align: center;"><img class="size-auto" src="images/stories/top_test/33.png" border="0" width="350" height="180" style="border: 0;" /></td>
<td><a href="index.php/topdeals/item/4-3-std-für-billiard-für-€9" target="_self"><img class="size-auto" src="images/stories/top_test/2.jpg" border="0" width="350" height="180" style="border: 0;" /></a></td>
</tr>
<tr>
<td><img class="size-auto" src="images/stories/top_test/6.png" border="0" width="160" height="201" style="float: right;" /></td>
<td><a href="index.php/topdeals/item/8-one-nights-stay-in-krown-hotel-for-$35-value-$70" target="_self"><img class="size-auto" src="images/stories/top_test/3.jpg" border="0" width="350" height="180" style="border: 0;" /></a></td>
<td><img class="size-auto" src="images/stories/top_test/7.png" border="0" width="160" height="201" /></td>
</tr>
<tr>
<td><a href="index.php/topdeals/item/3-hot-and-tasty-red-hot-pizza-at-30-off" target="_self"><img class="size-auto" src="images/stories/top_test/4.jpg" border="0" width="350" height="180" style="border: 0;" /></a></td>
<td> </td>
<td><a href="index.php/topdeals/item/2-50-off-at-deliciousushi-sushi-and-asian-cuisine" target="_self"><img class="size-auto" src="images/stories/top_test/5.jpg" border="0" width="350" height="180" style="border: 0px none; float: left;" /></a></td>
</tr>
</tbody>
</table>
11 years 10 months ago #1
by Yilmaz
i got a problem with the responsive layout of the template "Deal Plazza"
If i create a table whit pics inside, the pics and the hole table are not responsive, they stay always in the same size.
I do not need a table if it is not work whit tables, my point is to set 5 pics in various positions. It shoud just stay that way like one pic, it shoud not jump around on different resolutions.
My resolution is full hd, and there it looks ok. but every other resolution its jumps out of the window.
You can visit my site to have a look at it, its direkt on the frontpage, you wont miss it!
www.yeslimited.de/customers/dealsbook/
I woud be happy if someone can help me whit that.
Thats the code for the table:
<table class="size-auto" style="table-layout: auto;" width="988" border="0">
<tbody>
<tr>
<td><a href="index.php/topdeals/item/5-one-nights-stay-in-krown-hotel-for-$35-value-$70" target="_self"><img class="size-auto" src="images/stories/top_test/1.jpg" border="0" width="350" height="180" style="border: 0;" /></a></td>
<td style="text-align: center;"><img class="size-auto" src="images/stories/top_test/33.png" border="0" width="350" height="180" style="border: 0;" /></td>
<td><a href="index.php/topdeals/item/4-3-std-für-billiard-für-€9" target="_self"><img class="size-auto" src="images/stories/top_test/2.jpg" border="0" width="350" height="180" style="border: 0;" /></a></td>
</tr>
<tr>
<td><img class="size-auto" src="images/stories/top_test/6.png" border="0" width="160" height="201" style="float: right;" /></td>
<td><a href="index.php/topdeals/item/8-one-nights-stay-in-krown-hotel-for-$35-value-$70" target="_self"><img class="size-auto" src="images/stories/top_test/3.jpg" border="0" width="350" height="180" style="border: 0;" /></a></td>
<td><img class="size-auto" src="images/stories/top_test/7.png" border="0" width="160" height="201" /></td>
</tr>
<tr>
<td><a href="index.php/topdeals/item/3-hot-and-tasty-red-hot-pizza-at-30-off" target="_self"><img class="size-auto" src="images/stories/top_test/4.jpg" border="0" width="350" height="180" style="border: 0;" /></a></td>
<td> </td>
<td><a href="index.php/topdeals/item/2-50-off-at-deliciousushi-sushi-and-asian-cuisine" target="_self"><img class="size-auto" src="images/stories/top_test/5.jpg" border="0" width="350" height="180" style="border: 0px none; float: left;" /></a></td>
</tr>
</tbody>
</table>
Please Log in or Create an account to join the conversation.
- Posted by andy (759) Offline
Hi Adburrahman,
Can you try to remove the code "width="988"" in the line :
11 years 10 months ago #2
by andy
Can you try to remove the code "width="988"" in the line :
<table class="size-auto" style="table-layout: auto;" width="988" border="0">
Please Log in or Create an account to join the conversation.
- Posted by Yilmaz (45) Offline
Thanks for your fast reply,
yes indeed it worked, but it just pressed everything together, how can i tell him not just to shrink width he have to shrink the height too.
it have to be responsive not just shrink the width.
11 years 10 months ago #3
by Yilmaz
yes indeed it worked, but it just pressed everything together, how can i tell him not just to shrink width he have to shrink the height too.
it have to be responsive not just shrink the width.
Please Log in or Create an account to join the conversation.
- Posted by andy (759) Offline
Hmm can you try to remove all "height="xxx"" parts in the codes?
For example, change this code :to become :
11 years 10 months ago #4
by andy
For example, change this code :
<img class="size-auto" src="/images/stories/top_test/33.png" border="0" width="350" height="180" style="border: 0;" />
<img class="size-auto" src="/images/stories/top_test/33.png" border="0" width="350" style="border: 0;" />
Please Log in or Create an account to join the conversation.
- Posted by Yilmaz (45) Offline
You were right, it worked but whit a little problem,
i just realized that it just work on my phone (android) but on my notebook (smaller resolution) doesn work.
11 years 10 months ago #5
by Yilmaz
i just realized that it just work on my phone (android) but on my notebook (smaller resolution) doesn work.
Please Log in or Create an account to join the conversation.
- Posted by Yilmaz (45) Offline
This is the last code:
<table class="size-auto" style="table-layout: auto;" border="0">
<tbody>
<tr>
<td><a href="index.php/topdeals/item/5-one-nights-stay-in-krown-hotel-for-$35-value-$70" target="_self"><img class="size-auto" src="images/stories/top_test/1.jpg" border="0" style="border: 0;" /></a></td>
<td style="text-align: center;"><img class="size-auto" src="images/stories/top_test/33.png" border="0" style="border: 0;" /></td>
<td><a href="index.php/topdeals/item/4-3-std-für-billiard-für-€9" target="_self"><img class="size-auto" src="images/stories/top_test/2.jpg" border="0" style="border: 0;" /></a></td>
</tr>
<tr>
<td><img class="size-auto" src="images/stories/top_test/6.png" border="0" style="float: right;" /></td>
<td><a href="index.php/topdeals/item/8-one-nights-stay-in-krown-hotel-for-$35-value-$70" target="_self"><img class="size-auto" src="images/stories/top_test/3.jpg" border="0" style="border: 0;" /></a></td>
<td><img class="size-auto" src="images/stories/top_test/7.png" border="0" /></td>
</tr>
<tr>
<td><a href="index.php/topdeals/item/3-hot-and-tasty-red-hot-pizza-at-30-off" target="_self"><img class="size-auto" src="images/stories/top_test/4.jpg" border="0" style="border: 0;" /></a></td>
<td> </td>
<td><a href="index.php/topdeals/item/2-50-off-at-deliciousushi-sushi-and-asian-cuisine" target="_self"><img class="size-auto" src="images/stories/top_test/5.jpg" border="0" style="border: 0px none; float: left;" /></a></td>
</tr>
</tbody>
</table>
11 years 10 months ago #6
by Yilmaz
<table class="size-auto" style="table-layout: auto;" border="0">
<tbody>
<tr>
<td><a href="index.php/topdeals/item/5-one-nights-stay-in-krown-hotel-for-$35-value-$70" target="_self"><img class="size-auto" src="images/stories/top_test/1.jpg" border="0" style="border: 0;" /></a></td>
<td style="text-align: center;"><img class="size-auto" src="images/stories/top_test/33.png" border="0" style="border: 0;" /></td>
<td><a href="index.php/topdeals/item/4-3-std-für-billiard-für-€9" target="_self"><img class="size-auto" src="images/stories/top_test/2.jpg" border="0" style="border: 0;" /></a></td>
</tr>
<tr>
<td><img class="size-auto" src="images/stories/top_test/6.png" border="0" style="float: right;" /></td>
<td><a href="index.php/topdeals/item/8-one-nights-stay-in-krown-hotel-for-$35-value-$70" target="_self"><img class="size-auto" src="images/stories/top_test/3.jpg" border="0" style="border: 0;" /></a></td>
<td><img class="size-auto" src="images/stories/top_test/7.png" border="0" /></td>
</tr>
<tr>
<td><a href="index.php/topdeals/item/3-hot-and-tasty-red-hot-pizza-at-30-off" target="_self"><img class="size-auto" src="images/stories/top_test/4.jpg" border="0" style="border: 0;" /></a></td>
<td> </td>
<td><a href="index.php/topdeals/item/2-50-off-at-deliciousushi-sushi-and-asian-cuisine" target="_self"><img class="size-auto" src="images/stories/top_test/5.jpg" border="0" style="border: 0px none; float: left;" /></a></td>
</tr>
</tbody>
</table>
Please Log in or Create an account to join the conversation.