and this markup doesn't display according to what the CSS is doing. It displays correctly in a browser - Chrome & IE - but not in the VS designer. In the designer cell1 and cell2 stack vertically but the CSS dictates side-by-side (or should).
Can someone explain this? Offer solution?
I'd like it to look right in the designer so those who come behind me don't go WTF?????
First of all, congratulations on getting div tags to act like a table in the browser.
The trouble you are running into is that the designer view in VS is always just a little behind the actual browser development. Well that and the fact that div tags were never intended for precise control. Where tables are intended to be precise, div tags
are intended to be higher level and more flexible.
In the styles you may want to check into the position, top and left attributes. These will work but you have to do a lot of fiddling. The alternative is that if you want it to act like a table then make it a table.
Marked as answer by chazizzle on Jan 29, 2013 04:01 PM
I understand that VS isn't always up-to-speed on rendering for the designer, but I wanted to make sure there wasn't some aspect of my styling that wasn't messing with things.
I may go back to using tables, but I'm not crazy about the idea. Tables are meant to display tabular data, a la a spreadsheet, and not to force forms layout (although it works well for that). I was hoping to find a way to get away from using tables, but
......
chazizzle
Member
38 Points
27 Posts
Designer doesn't display correctly.
Jan 28, 2013 08:14 PM|LINK
I'm working with some html and css in an .aspx page along these lines:
<div style="width:500px; display:table; border-spacing: 4px;"> <div style="width:100%; display:table-row; height:24px;"> <div id="cell1" style="width:50px; display:table-cell; background-color: #ffc0cb;">fdgdf</div> <div id="cell2" style="width:400px; display:table-cell; background-color: #cd853f">fdgdfg</div> </div> </div>and this markup doesn't display according to what the CSS is doing. It displays correctly in a browser - Chrome & IE - but not in the VS designer. In the designer cell1 and cell2 stack vertically but the CSS dictates side-by-side (or should).
Can someone explain this? Offer solution?
I'd like it to look right in the designer so those who come behind me don't go WTF?????
kraznodar
Contributor
3333 Points
883 Posts
Re: Designer doesn't display correctly.
Jan 29, 2013 02:42 PM|LINK
First of all, congratulations on getting div tags to act like a table in the browser.
The trouble you are running into is that the designer view in VS is always just a little behind the actual browser development. Well that and the fact that div tags were never intended for precise control. Where tables are intended to be precise, div tags are intended to be higher level and more flexible.
In the styles you may want to check into the position, top and left attributes. These will work but you have to do a lot of fiddling. The alternative is that if you want it to act like a table then make it a table.
chazizzle
Member
38 Points
27 Posts
Re: Designer doesn't display correctly.
Jan 29, 2013 03:51 PM|LINK
Thanks!
I understand that VS isn't always up-to-speed on rendering for the designer, but I wanted to make sure there wasn't some aspect of my styling that wasn't messing with things.
I may go back to using tables, but I'm not crazy about the idea. Tables are meant to display tabular data, a la a spreadsheet, and not to force forms layout (although it works well for that). I was hoping to find a way to get away from using tables, but ......
Thanks again ..
</chaz>