Wrap table μέσω Div/CSS και προσθήκη εικόνων

[macabre_sunsets]

Μάλλον ο τίτλος δεν είναι και ότι πιο κατατοπιστικό αλλά ας εξηγήσω τι θέλω να κάνω (αν γίνεται δλδ... αλλιώς...)

Έστω ότι έχουμε ένα table μέσα σε ένα div. Είναι δυνατόν να προσθέσουμε εικόνες γύρω από το table με την χρήση του div? Ή γενικά εικόνες γύρω από το table με την χρήση css?

Για παράδειγμα στην επισυναπτόμενη εικόνα, έχουμε το table (κίτρινο) και γύρω του τις εικόνες (γαλάζιο), αλλά όλα μέσα στο div (άσπρο). Επισημαίνω το div μήπως και βοηθήσει. Αλλιώς δεν μας νοιάζει.

Απλά θέλω να αποφύγω να βάλω το table μέσα σε ένα άλλο table και ψάχνω μπας και υπάρχει κάποια εναλλακτική.

[merianos]

Δοκίμασε αυτό :

<div>

<img src=”top_image” style=”width:ίσο με το πλάτος του Div” />

<img src=”left_image” style=”width:ίσο με το πλάτος που θέλεις; height:ίσο με το ύψος του πίνακα; float:left;” />

<table style=”float:left;”>

<tr>

<td>

</td>

</tr>

<tr>

……….

</tr>

<tr>

<td>

</td>

</tr>

</table>

<img src=”right_image” style=”width:ίσο με το πλάτος που θέλεις; height:ίσο με το ύψος του πίνακα;” />

<br style=”clear:both;” />

<img src=”left_botom” style=”width:ίσο με το πλάτος του Div” />

</div>

[macabre_sunsets]

Ευχαριστώ για την απάντηση. Μάλλον δεν το έχω διατυπώσει σωστά :/

Βασικά θέλω να αποφύγω όσο το δυνατόν πιο πολύ την γραφή έξτρα κώδικα. Αμα γινόταν ίσως με css μέσα από τον ορισμό του div? Ή αμα ορίσω κάπως για το table να έχει εικόνες στις άκρες πάλι μέσω css?

Βασικά έχω καμια 100αρια tables που θέλω να γίνει αυτή η δουλειά και ποιός κάθεται να τα κάνει τώρα ένα ένα...

[merianos]

Τότε μετέτρεψε αυτό :

<div>

<img src=”top_image” style=”width:ίσο με το πλάτος του Div” />

<img src=”left_image” style=”width:ίσο με το πλάτος που θέλεις; height:ίσο με το ύψος του πίνακα; float:left;” />

<table style=”float:left;”>

<tr>

<td>

</td>

</tr>

<tr>

……….

</tr>

<tr>

<td>

</td>

</tr>

</table>

<img src=”right_image” style=”width:ίσο με το πλάτος που θέλεις; height:ίσο με το ύψος του πίνακα;” />

<br style=”clear:both;” />

<img src=”left_botom” style=”width:ίσο με το πλάτος του Div” />

</div>

 

Σε αυτό :

HTML

<div class=”container”>

<div class=”top_image”></div>

<div class=”left_image”></div>

<table style=”float:left;width:600px;”>

<tr>

<td>

</td>

</tr>

<tr>

……….

</tr>

<tr>

<td>

</td>

</tr>

</table>

<br style=”clear:both;” /> <!—Gia na katharisei kathe proigoumeno float //

<div class=”right_image”></div>

<div class=”bottom_image”></div>

</div>

 

CSS

div.container

{

width:800px;

}

div.top_image

{

background-image: url(‘background-image’);

background-repeat: no-repeat;

display: block;

width: 800px;

height: 150px;

}

 

div.left_image

{

background-image: url(‘background-image’);

background-repeat: no-repeat;

display: block;

width: 100px;

height: equal to table;

float: left; /* Gia na kolisei to Table sta deksi tou div*/

}

div.right_image

{

background-image: url(‘background-image’);

background-repeat: no-repeat;

display: block;

width: 100px;

height: equal to table;

float: left; /* Gia na kolisei sta deskia toy Table */

}

div.bottom_image

{

background-image: url(‘background-image’);

background-repeat: no-repeat;

display: block;

width: 800px;

height: 150px;

}

 

Ποιο αυτοματοποιημένη διαδικασία δεν γνωρίζω. Μετά θα πρέπει να πας σε CMS

[macabre_sunsets]

Ευχαριστώ για τον χρόνο σου. Μάλλον ζητάω πολλά (το ήξερα από την αρχή αλλά είπα μπας και υπάρχει κάτι που δεν έχει πέσει στην αντίληψή μου) και με βλέπω για manual αλλαγές πάλι :/

[PCharon]

Αν έχεις τα html αρχεία μαζεμένα μπορείς να κάνεις την αντικατάσταση/προσθήκη στο πι-και-φι, δε χρειάζεται να τα ανοίγεις ένα-ένα. Mε κάποιο "replace in files" feature. Έχω κάνει πολύ χειρότερα από αυτό.

 

Ύστερα.

[macabre_sunsets]

Αυτό θα ήταν μια καλή ιδέα, αλλά θα πρέπει κάπως αυτόματα να βρίσκει που αρχίζει και που τελειώνει το κάθε table. Έστω την αρχή την βρίσκω εύκολα, δεδομένου ότι είναι μέσα σε ένα ψιλο στάνταρ div. Το τέλος πώς να το βρώ? Μερικά table έχουν άλλα sub-table μέσα τους :/

Πάντως κάτι τέτοιο δεν θα ήταν άσχημη ιδέα έτσι όπως το έθεσες...

Ίσως με κάποιο home-made πρόγραμμα...

[PCharon]

Αχ, δεν το'χεις, δεν το'χεις...

 

Ύστερα.

[macabre_sunsets]

Δλδ τι εννοείς?