After spending 2 days trying to figure this out on my own, I have come to a dead end. It seems that my lack of expertise in CSS is the root cause of the issue.
Here is the code snippet I am working with:
<table class="demo">
<tr>
<th style="background:#FFFFFF;border:0px solid #FFFFFF;" WIDTH="140">
<img src="https://xxxxxxxxxx.com/images/genesys_logo_1.png" border="0"><BR><BR>
</th>
<th>
<form method="post" action="https://xxxxxxxxxx.com<?php echo $thisPage; ?>" onsubmit="return mysubmit(this);">
<input type="hidden" name="primary" value="<?php echo array_values($p_key)[$i]; ?>">
<input type="hidden" name="archived" value="y">
<input style="float: left; display: block;margin: 42px 0px 0px -1px ;!important;" type="submit" VALUE="✄"/>
</form>
<span style="font-size: 16px; !important;"><?php if(array_values($link_kt)[$i]!="") {?><A href="<?php echo array_values($link_kt)[$i]; ?>" TARGET="_BLANK"><?php } ?><?php echo $cust_name[$i]; ?><?php if(array_values($link_kt)[$i]!="") {?></a><?php } ?></SPAN>
<BR>
<span style="font-size: 11px; text-align: middle; !important;">PID: <?php if(array_values($link_oa)[$i]!="") {?><A href="<?php echo array_values($link_oa)[$i]; ?>" TARGET="_BLANK"><?php } ?><?php echo array_values($pid)[$i]; ?><?php if(array_values($link_oa)[$i]!="") {?></a><?php } ?></span>
<form action="<?php echo $linkUpdate; ?>" method="post">
<input style="float: right; display: block;margin: 6px -1px 0px 0px ;!important;" type="submit" value="✎ " />
</form>
</th>
</tr>
</table>
And here is the accompanying CSS:
.demo {
width:100%;
border:0px solid #333333;
border-bottom: 1px solid #333333;
border-spacing:0px;
padding:3px;
border-collapse: collapse;
}
.demo th {
min-width:160px;
max-width:160px;
border:1px solid #333333;
padding:3px;
background:#999999;
font-family: 'Helvetica Neue', sans-serif;
font-size: 14px;
}
https://i.sstatic.net/rDlAA.png
The cell content is not centered as desired. This issue has been causing me quite some frustration!
I want the layout to remain intact even when the screen size changes. Currently, the buttons are behaving correctly but the text alignment is off.
Any suggestions on how to tackle this problem?